ideas for development support

[JoernT]

As Fore documents can get complex the problem of how to debug arises as in every other language. Due to its special nature we need different answers as in 'traditional' JS frameworks.

This document gathers a few of them:

dev-mode CSS

By default the whole model and also all actions have no visual appearance but play a major role of course. For complex pages its often hard to see on which element exactly an error or unexpected behavior occurred.

Simiple CSS can help to make the model and actions visible and by that allow easy inspection by devtools to see the full element in the DOM at runtime.

loggin error to the document

Authoring errors are going to be alerted within the document from now on. It only has been applied e.g. in 'load.html' demo but will be extended for all other relevant cases.

Authoring errors are different from other runtime errors and include:

• misspelled or non-existing idrefs (instances, submissions, repeat, dispatch...)
• syntactically incorrect XPath statements

Logging to the document allows to highlight the suspicious element and allows inspection of that element.

Extending modelitem into full web component

If we make modelitem a full web component we can add it to the DOM for debugging purposes. This should certainly only happen under a 'dev' flag on fx-foreelement and not be used in production to not downgrade performance by creating DOM elements.

But given a 'dev' mode is set it would allow us to put the modelitem of a control or output as a child of the respective element. Then by 'dev-mode' CSS the modelitem webcomponent could output its current state to the DOM as part of its shadowDOM. Likewise it might be helpful to put it beneath fx- bind elements to have a more direct access to it instead of searching the whole model.

Helpful side effect that this could also help reduce the console logging.

[JoernT]

already outdated by latest devs on inspector tool