[MGNLFE-633] On mgnlFrameReady Magnolia to retry rendering green bars until successful Created: 06/Sep/23  Updated: 05/Oct/23

Status: Accepted
Project: Magnolia Frontend Helpers
Component/s: None
Affects Version/s: None
Fix Version/s: None

Type: Improvement Priority: Blocker
Reporter: Bartosz Staryga Assignee: Unassigned
Resolution: Unresolved Votes: 1
Labels: None
Remaining Estimate: Not Specified
Time Spent: Not Specified
Original Estimate: Not Specified

Template:
Acceptance criteria:
Empty
Task DoD:
[ ]* Doc/release notes changes? Comment present?
[ ]* Downstream builds green?
[ ]* Solution information and context easily available?
[ ]* Tests
[ ]* FixVersion filled and not yet released
[ ]  Architecture Decision Record (ADR)
Date of First Response:
Epic Link: Support
Team: DeveloperX

 Description   

Inside the preview, the iframe FE libraries call `mgnlFrameReady` function to tell Magnolia to render green bars.

When default FE libs behaviour is not enough, developers can explicitly call `mgnlFrameReady` to tell Magnolia to render the green bars.

It sometimes still can be not enough and editors needs to refresh the page to be able to edit it.

Could we modify the `mgnlFrameReady` function itself or how Magnolia handles it that it would be enough just to call it once, and Magnolia will keep retrying to render the green bars until successful?

successful could be as simple as check the HTML DOM for green bars elements, or some more advanced technique.

 



 Comments   
Comment by Christopher Zimmermann [ 08/Sep/23 ]

Is the reporter using the latest version of react-editor 1.4.0? fsacharuk 

Comment by Bartosz Staryga [ 11/Sep/23 ]

czimmermann "Also adding something similar in FE libs is not ideal, we do not want to bloat them too." something more elegant as we have in FE libs this check that checks against `cms:page` and tries to render green bars. (https://git.magnolia-cms.com/projects/MODULES/repos/frontend-helpers/browse/packages/template-annotations/src/service/EditorContextHelper.js#83)
It does not seem to work, somehow in that situation this is not enough. We can see the action bar is working, so page is initialized correctly, but no greenbars.
Ideally it would be some cleaner way.
Also, this code, whatever way it'll look could live inside the JS that FE libs add to the page, the one that is part of Pages App, so we would keep the FE libs as lean as possible - they are part of projects front end after all.

I did ask for version bump too (though from all I see the delay magic was already in the 1.2.1-beta2).

Comment by Christopher Zimmermann [ 11/Sep/23 ]

Thanks for the additional input bstaryga, makes sense. Yes could see it page-editor-bridge. Lets see how their project works on react-editor 1.4.0. 

Comment by Bartosz Staryga [ 18/Sep/23 ]

czimmermann guys have not yet had chancer to upgraded to 1.4, but they added the method like the one mentioned above and this has helped.
Might be worth considering adding additional check in here https://git.magnolia-cms.com/projects/MODULES/repos/frontend-helpers/browse/packages/template-annotations/src/service/EditorContextHelper.js#83
On top of checking against `cms:page` to also check for div green bar element/s.

Comment by Christopher Zimmermann [ 18/Sep/23 ]

Thanks for the additional info.

Comment by Christopher Zimmermann [ 04/Oct/23 ]

Flag added

Have not yet reached agreement on how to proceed.

Generated at Mon Feb 12 05:49:19 CET 2024 using Jira 9.4.2#940002-sha1:46d1a51de284217efdcb32434eab47a99af2938b.