fix(engine-server): use standard shadowrootmode attribute (#3903)

* fix(engine-server): use standard shadowrootmode attribute * test: fix polyfill in test * test: fix test in safari --------- Co-authored-by: James Tu <[email protected]>
salesforce · Jan 17, 2024 · e1c8085 · e1c8085
1 parent b1ac0aa
commit e1c8085
Show file tree

Hide file tree

Showing 79 changed files with 163 additions and 153 deletions.
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-aria-modify/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-aria-modify/expected.html
@@ -1,4 +1,4 @@
 <x-cmp aria-busy="true" aria-activedescendant="foo">
-  <template shadowroot="open">
+  <template shadowrootmode="open">
   </template>
 </x-cmp>
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-aria/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-aria/expected.html
@@ -1,7 +1,7 @@
 <x-parent>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <x-child aria-activedescendant="foo" aria-atomic="foo" aria-autocomplete="foo" aria-busy="foo" aria-checked="foo" aria-colcount="foo" aria-colindex="foo" aria-colindextext="foo" aria-colspan="foo" aria-controls="foo" aria-current="foo" aria-describedby="foo" aria-description="foo" aria-details="foo" aria-disabled="foo" aria-errormessage="foo" aria-expanded="foo" aria-flowto="foo" aria-haspopup="foo" aria-hidden="foo" aria-invalid="foo" aria-keyshortcuts="foo" aria-label="foo" aria-labelledby="foo" aria-level="foo" aria-live="foo" aria-modal="foo" aria-multiline="foo" aria-multiselectable="foo" aria-orientation="foo" aria-owns="foo" aria-placeholder="foo" aria-posinset="foo" aria-pressed="foo" aria-readonly="foo" aria-relevant="foo" aria-required="foo" aria-roledescription="foo" aria-rowcount="foo" aria-rowindex="foo" aria-rowindextext="foo" aria-rowspan="foo" aria-selected="foo" aria-setsize="foo" aria-sort="foo" aria-valuemax="foo" aria-valuemin="foo" aria-valuenow="foo" aria-valuetext="foo" aria-braillelabel="foo" aria-brailleroledescription="foo" role="foo">
-      <template shadowroot="open">
+      <template shadowrootmode="open">
       </template>
     </x-child>
     <div aria-activedescendant="foo" aria-atomic="foo" aria-autocomplete="foo" aria-busy="foo" aria-checked="foo" aria-colcount="foo" aria-colindex="foo" aria-colindextext="foo" aria-colspan="foo" aria-controls="foo" aria-current="foo" aria-describedby="foo" aria-description="foo" aria-details="foo" aria-disabled="foo" aria-errormessage="foo" aria-expanded="foo" aria-flowto="foo" aria-haspopup="foo" aria-hidden="foo" aria-invalid="foo" aria-keyshortcuts="foo" aria-label="foo" aria-labelledby="foo" aria-level="foo" aria-live="foo" aria-modal="foo" aria-multiline="foo" aria-multiselectable="foo" aria-orientation="foo" aria-owns="foo" aria-placeholder="foo" aria-posinset="foo" aria-pressed="foo" aria-readonly="foo" aria-relevant="foo" aria-required="foo" aria-roledescription="foo" aria-rowcount="foo" aria-rowindex="foo" aria-rowindextext="foo" aria-rowspan="foo" aria-selected="foo" aria-setsize="foo" aria-sort="foo" aria-valuemax="foo" aria-valuemin="foo" aria-valuenow="foo" aria-valuetext="foo" aria-braillelabel="foo" aria-brailleroledescription="foo" role="foo">

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-boolean/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-boolean/expected.html
@@ -1,5 +1,5 @@
 <x-attribute-boolean>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <input type="checkbox" required readonly checked>
   </template>
 </x-attribute-boolean>
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-component-aria/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-component-aria/expected.html
@@ -1,7 +1,7 @@
 <x-attribute-component-aria>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <x-child role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="20">
-      <template shadowroot="open">
+      <template shadowrootmode="open">
       </template>
     </x-child>
   </template>

diff --git a/...s/@lwc/engine-server/src/__tests__/fixtures/attribute-component-global-html/expected.html b/...s/@lwc/engine-server/src/__tests__/fixtures/attribute-component-global-html/expected.html
@@ -1,7 +1,7 @@
 <x-attribute-component-global-html>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <x-child class="foo bar" style="color: red; background: blue" data-test="test" accesskey="A" contenteditable="true" draggable="true" hidden id="foo" itemprop="foo" spellcheck="true" tabindex="-1">
-      <template shadowroot="open">
+      <template shadowrootmode="open">
         Passthrough properties:
         <ul>
           <li>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-dynamic-escape/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-dynamic-escape/expected.html
@@ -1,5 +1,5 @@
 <x-attribute-dynamic-escape>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <div data-attr="&quot;>
     </div>
     This 'should' be escaped

diff --git a/...@lwc/engine-server/src/__tests__/fixtures/attribute-dynamic-with-scoped-css/expected.html b/...@lwc/engine-server/src/__tests__/fixtures/attribute-dynamic-with-scoped-css/expected.html
@@ -1,5 +1,5 @@
 <x-attribute-dynamic-with-scoped-css class="lwc-47oqt8q93b2-host">
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <style class="lwc-47oqt8q93b2" type="text/css">
       div.lwc-47oqt8q93b2 {color: black;}div.kree.lwc-47oqt8q93b2 {color: blue;}
     </style>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-dynamic/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-dynamic/expected.html
@@ -1,5 +1,5 @@
 <x-attribute-dynamic>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <div class="foo" style="color: red;" data-foo="foo">
     </div>
   </template>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-global-html/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-global-html/expected.html
@@ -1,5 +1,5 @@
 <x-attribute-global-html>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <div class="foo bar" style="color: red; background: blue" accesskey="A" contenteditable="true" data-test="test" draggable="true" hidden id="foo" itemprop="foo" lang="fr" spellcheck="true" tabindex="-1" title="foo">
     </div>
   </template>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-live-bindings/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-live-bindings/expected.html
@@ -1,5 +1,5 @@
 <x-attribute-live-bindings>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <p>
       Checked: 
       <input type="checkbox" checked>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-static/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-static/expected.html
@@ -1,5 +1,5 @@
 <x-attribute-static>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <div class="foo bar foo-bar" data-foo="foo" style="color: red; background-color: blue;">
     </div>
   </template>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-style/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/attribute-style/expected.html
@@ -1,5 +1,5 @@
 <x-attribute-style>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <div style="color: red;">
     </div>
     <div style="color: blue; background: black; border: 1px solid red;">
@@ -11,19 +11,19 @@
     <div style="color: salmon; background-color: chocolate;">
     </div>
     <x-child style="color: red">
-      <template shadowroot="open">
+      <template shadowrootmode="open">
       </template>
     </x-child>
     <x-child style="color: blue; background: black; border: 1px solid red">
-      <template shadowroot="open">
+      <template shadowrootmode="open">
       </template>
     </x-child>
     <x-child style="border-width: 1px; border-style: solid; border-color: red">
-      <template shadowroot="open">
+      <template shadowrootmode="open">
       </template>
     </x-child>
     <x-child style="color: salmon; background-color: chocolate;">
-      <template shadowroot="open">
+      <template shadowrootmode="open">
       </template>
     </x-child>
   </template>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/attributes-aria/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/attributes-aria/expected.html
@@ -1,5 +1,5 @@
 <x-attributes-aria>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <span id="label-id">
       This is a section
     </span>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/comments-basic/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/comments-basic/expected.html
@@ -1,5 +1,5 @@
 <x-comments-basic>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <!-- This is an HTML comment -->
     <button>
       click me

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/comments-foreach/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/comments-foreach/expected.html
@@ -1,5 +1,5 @@
 <x-comments-foreach>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <ul>
       <!-- color -->
       <li>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/comments-if/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/comments-if/expected.html
@@ -1,5 +1,5 @@
 <x-comments-if>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <!-- HTML comment inside if:true -->
     <p>
       true branch

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/comments-slot/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/comments-slot/expected.html
@@ -1,7 +1,7 @@
 <x-comments-slot>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <x-child>
-      <template shadowroot="open">
+      <template shadowrootmode="open">
         shadow content before slot
         <slot>
         </slot>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/component/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/component/expected.html
@@ -1,7 +1,7 @@
 <x-component>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <x-child>
-      <template shadowroot="open">
+      <template shadowrootmode="open">
         I am a child component
       </template>
     </x-child>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/computed/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/computed/expected.html
@@ -1,5 +1,5 @@
 <x-computed>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     7 + 3 = 10
   </template>
 </x-computed>
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/context-deep/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/context-deep/expected.html
@@ -1,9 +1,9 @@
 <x-provider>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <x-middle>
-      <template shadowroot="open">
+      <template shadowrootmode="open">
         <x-consumer>
-          <template shadowroot="open">
+          <template shadowrootmode="open">
             <div>
               some context
             </div>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/context-nested/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/context-nested/expected.html
@@ -1,9 +1,9 @@
 <x-provider>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <x-provider-nested>
-      <template shadowroot="open">
+      <template shadowrootmode="open">
         <x-consumer>
-          <template shadowroot="open">
+          <template shadowrootmode="open">
             <div>
               top-level and nested
             </div>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/context-no-provider/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/context-no-provider/expected.html
@@ -1,7 +1,7 @@
 <x-parent>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <x-consumer>
-      <template shadowroot="open">
+      <template shadowrootmode="open">
         <div>
           I have no context for this
         </div>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/context-shadowed/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/context-shadowed/expected.html
@@ -1,9 +1,9 @@
 <x-provider>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <x-middle>
-      <template shadowroot="open">
+      <template shadowrootmode="open">
         <x-consumer>
-          <template shadowroot="open">
+          <template shadowrootmode="open">
             <div>
               shadowed context
             </div>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/context-simple/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/context-simple/expected.html
@@ -1,7 +1,7 @@
 <x-provider>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <x-consumer>
-      <template shadowroot="open">
+      <template shadowrootmode="open">
         <div>
           some context
         </div>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/context-slotted/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/context-slotted/expected.html
@@ -1,12 +1,12 @@
 <x-root>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <x-provider>
-      <template shadowroot="open">
+      <template shadowrootmode="open">
         <slot>
         </slot>
       </template>
       <x-consumer>
-        <template shadowroot="open">
+        <template shadowrootmode="open">
           <div>
             some context
           </div>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/custom-styles-with-newlines/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/custom-styles-with-newlines/expected.html
@@ -1,5 +1,5 @@
 <x-component>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <div style="
             color: blue;
             margin: 8px;

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/delegates-focus/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/delegates-focus/expected.html
@@ -1,5 +1,5 @@
 <x-delegates-focus>
-  <template shadowroot="open" shadowrootdelegatesfocus>
+  <template shadowrootmode="open" shadowrootdelegatesfocus>
     <button>
       Focus!
     </button>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/directive-external/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/directive-external/expected.html
@@ -1,7 +1,7 @@
 <x-test>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <x-hello>
-      <template shadowroot="open">
+      <template shadowrootmode="open">
         <p>
           Hello World
         </p>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/dynamic-component-no-ctor/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/dynamic-component-no-ctor/expected.html
@@ -1,4 +1,4 @@
 <x-dynamic-component-no-ctor>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
   </template>
 </x-dynamic-component-no-ctor>
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/dynamic-components/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/dynamic-components/expected.html
@@ -1,7 +1,7 @@
 <x-dynamic-component>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <x-test>
-      <template shadowroot="open">
+      <template shadowrootmode="open">
         Test dynamic component!
       </template>
     </x-test>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/dynamic-slots/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/dynamic-slots/expected.html
@@ -1,7 +1,7 @@
 <x-slots>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <x-receiver>
-      <template shadowroot="open">
+      <template shadowrootmode="open">
         <div>
           Default slot: 
           <slot>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/face-callback/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/face-callback/expected.html
@@ -1,12 +1,12 @@
 <face-container>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <form>
       <face-control>
-        <template shadowroot="open">
+        <template shadowrootmode="open">
         </template>
       </face-control>
       <face-control>
-        <template shadowroot="open">
+        <template shadowrootmode="open">
         </template>
       </face-control>
     </form>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/for-each-block/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/for-each-block/expected.html
@@ -1,5 +1,5 @@
 <x-for-each-block>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <ul>
       <li>
         0 - paris

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/for-each-child-nested/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/for-each-child-nested/expected.html
@@ -1,10 +1,10 @@
 <x-for-each-child-nested>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <ol>
       <li>
         europe
         <x-child>
-          <template shadowroot="open">
+          <template shadowrootmode="open">
             <li>
               0 - paris
             </li>
@@ -20,7 +20,7 @@
       <li>
         asia
         <x-child>
-          <template shadowroot="open">
+          <template shadowrootmode="open">
             <li>
               0 - tokyo
             </li>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/for-each-nested/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/for-each-nested/expected.html
@@ -1,5 +1,5 @@
 <x-for-each-nested>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <ol>
       <li>
         europe

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/for-static-content/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/for-static-content/expected.html
@@ -1,5 +1,5 @@
 <x-container>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <ul>
       <li>
         <div>

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/getter-class-list/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/getter-class-list/expected.html
@@ -1,4 +1,4 @@
 <x-getter-class-list class="a c d-e">
-  <template shadowroot="open">
+  <template shadowrootmode="open">
   </template>
 </x-getter-class-list>
diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/getter-is-connected/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/getter-is-connected/expected.html
@@ -1,5 +1,5 @@
 <x-getter-is-connected>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     <ul>
       <li>
         constructor: false

diff --git a/packages/@lwc/engine-server/src/__tests__/fixtures/if-block/expected.html b/packages/@lwc/engine-server/src/__tests__/fixtures/if-block/expected.html
@@ -1,5 +1,5 @@
 <x-if-block>
-  <template shadowroot="open">
+  <template shadowrootmode="open">
     I am rendered!
   </template>
 </x-if-block>