render outside of target #5

benzen · 2018-01-06T15:46:04Z

Here is an exemple

<html>
  <head>
    <script src="/js/magery-compiler.js"></script>
    <script src="/js/magery-patcher.js"></script>
    <script src="/js/redux.js"></script>
    <template data-tagname="app-title">
      <h1>{{text}}</h1>
    </template>
  </head>
  <body>
    <app></app>

    <script>
      var components = MageryCompiler.compile('template');

      // create a store
      var store = Redux.createStore(function (state, action) {
          if (typeof state === 'undefined') {
            return {
              title: "fuck mennn",
              count: 0
            };
           }
           switch (action.type) {
            case 'INCREMENT':
              return {count: state.count + 1};
            case 'DECREMENT':
              return {count: state.count - 1};
            default:
              return state;
           }
       });

       var target = document.querySelector('app');
       var handlers = {};

       function render() {
          console.log(store.getState())
          components['app-title'](target, store.getState(), handlers);
       }

       // add event handlers using Magery
       handlers.increment = function () {
           store.dispatch({type: 'INCREMENT'});
       };
       handlers.decrement = function () {
           store.dispatch({type: 'DECREMENT'});
       };

       // update the page when the store changes
       store.subscribe(render);

       // initial render
       render();
    </script>
  </body>
</html>

I've noticed that in the produced dom, the tree rendered by outside ouf the target

<html><head>
...
    <template data-tagname="app-title">
      <h1>{{text}}</h1>
    </template>
  </head>
  <body>
    <app-title>
      <h1></h1>
    </app-title><app></app>
    <script>
...

</body></html>

The text was updated successfully, but these errors were encountered:

benzen · 2018-01-06T15:52:19Z

What i see as a side effect of this, a second render will produce a new tree

caolan · 2018-01-08T21:38:40Z

This appears to happen when the tag names are mismatched. So when the target does not match the template tag being rendered onto it. I'm not sure what the appropriate action is in this case, but it should not render a new adjacent tree... perhaps it should just produce an error.

benzen · 2018-01-09T03:02:27Z

Totally agreed Benjamin Dreux

…

Le 8 janv. 2018 à 16:38, Caolan McMahon ***@***.***> a écrit : This appears to happen when the tag names are mismatched. So when the target does not match the template tag being rendered onto it. I'm not sure what the appropriate action is in this case, but it should not render a new adjacent tree... perhaps it should just produce an error. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or mute the thread.

caolan added the bug label Jan 21, 2018

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

render outside of target #5

render outside of target #5

benzen commented Jan 6, 2018

benzen commented Jan 6, 2018

caolan commented Jan 8, 2018

benzen commented Jan 9, 2018 via email

render outside of target #5

render outside of target #5

Comments

benzen commented Jan 6, 2018

benzen commented Jan 6, 2018

caolan commented Jan 8, 2018

benzen commented Jan 9, 2018 via email