| Tests that distributed nodes and their updates are correctly shown in different shadow host display modes. |
| |
| ========= Original ======== |
| - <div id="shadowHost"> |
| <div slot="distributeMeToYoungest">\n youngest distributed text\n </div> |
| <div slot="distributeMeToOldest">\n oldest distributed text\n </div> |
| <div slot="distributeMeToInner">\n oldest distributed text\n </div> |
| <div slot="distributeMeToInner">\n oldest distributed text\n </div> |
| </div> |
| ========= After shadow root created ======== |
| - <div id="shadowHost"> |
| - #shadow-root (open) |
| - <div class="oldestShadowMain"> |
| - <slot name=".distributeMeToOldest"> |
| <div id="fallbackOldest"></div> |
| </slot> |
| </div> |
| <div slot="distributeMeToYoungest">\n youngest distributed text\n </div> |
| <div slot="distributeMeToOldest">\n oldest distributed text\n </div> |
| <div slot="distributeMeToInner">\n oldest distributed text\n </div> |
| <div slot="distributeMeToInner">\n oldest distributed text\n </div> |
| </div> |
| ========= After adding distributed node ======== |
| - <div id="shadowHost"> |
| - #shadow-root (open) |
| - <div class="oldestShadowMain"> |
| - <slot name=".distributeMeToOldest"> |
| <div id="fallbackOldest"></div> |
| </slot> |
| </div> |
| <div slot="distributeMeToYoungest">\n youngest distributed text\n </div> |
| <div slot="distributeMeToOldest">\n oldest distributed text\n </div> |
| <div slot="distributeMeToInner">\n oldest distributed text\n </div> |
| <div slot="distributeMeToInner">\n oldest distributed text\n </div> |
| <div slot="distributeMeAsWell_1"></div> |
| </div> |
| ========= After adding another distributed node ======== |
| - <div id="shadowHost"> |
| - #shadow-root (open) |
| - <div class="oldestShadowMain"> |
| - <slot name=".distributeMeToOldest"> |
| <div id="fallbackOldest"></div> |
| </slot> |
| </div> |
| <div slot="distributeMeToYoungest">\n youngest distributed text\n </div> |
| <div slot="distributeMeToOldest">\n oldest distributed text\n </div> |
| <div slot="distributeMeToInner">\n oldest distributed text\n </div> |
| <div slot="distributeMeToInner">\n oldest distributed text\n </div> |
| <div slot="distributeMeAsWell_1"></div> |
| <div slot="distributeMeAsWell_2"></div> |
| </div> |
| |