test: extend confirm-dialog snapshots to cover shadow DOM (#9940)

Author: web-padawan

packages/confirm-dialog/test/dom/__snapshots__/confirm-dialog.test.snap.js

@@ -1,7 +1,7 @@
 /* @web/test-runner snapshot v1 */
 export const snapshots = {};
 
-snapshots["vaadin-confirm-dialog host"] =
+snapshots["vaadin-confirm-dialog host"] = 
 `<vaadin-confirm-dialog
   aria-description="Do you want to save or discard the changes?"
   aria-label="Unsaved changes"
@@ -45,8 +45,7 @@ snapshots["vaadin-confirm-dialog host"] =
 `;
 /* end snapshot vaadin-confirm-dialog host */
 
-
-snapshots["vaadin-confirm-dialog overlay"] =
+snapshots["vaadin-confirm-dialog shadow"] = 
 `<vaadin-confirm-dialog-overlay
   exportparts="backdrop, overlay, header, content, message, footer, cancel-button, confirm-button, reject-button"
   focus-trap=""
@@ -82,9 +81,9 @@ snapshots["vaadin-confirm-dialog overlay"] =
   </slot>
 </vaadin-confirm-dialog-overlay>
 `;
-/* end snapshot vaadin-confirm-dialog overlay */
+/* end snapshot vaadin-confirm-dialog shadow */
 
-snapshots["vaadin-confirm-dialog overlay theme"] =
+snapshots["vaadin-confirm-dialog theme"] = 
 `<vaadin-confirm-dialog-overlay
   exportparts="backdrop, overlay, header, content, message, footer, cancel-button, confirm-button, reject-button"
   focus-trap=""
@@ -121,5 +120,56 @@ snapshots["vaadin-confirm-dialog overlay theme"] =
   </slot>
 </vaadin-confirm-dialog-overlay>
 `;
-/* end snapshot vaadin-confirm-dialog overlay theme */
+/* end snapshot vaadin-confirm-dialog theme */
+
+snapshots["vaadin-confirm-dialog overlay"] = 
+`<div
+  id="backdrop"
+  part="backdrop"
+>
+</div>
+<div
+  id="overlay"
+  part="overlay"
+  tabindex="0"
+>
+  <header part="header">
+    <slot name="header">
+    </slot>
+  </header>
+  <div
+    id="content"
+    part="content"
+  >
+    <div part="message">
+      <slot>
+      </slot>
+    </div>
+  </div>
+  <footer
+    part="footer"
+    role="toolbar"
+  >
+    <div
+      hidden=""
+      part="cancel-button"
+    >
+      <slot name="cancel-button">
+      </slot>
+    </div>
+    <div
+      hidden=""
+      part="reject-button"
+    >
+      <slot name="reject-button">
+      </slot>
+    </div>
+    <div part="confirm-button">
+      <slot name="confirm-button">
+      </slot>
+    </div>
+  </footer>
+</div>
+`;
+/* end snapshot vaadin-confirm-dialog overlay */
 

packages/confirm-dialog/test/dom/confirm-dialog.test.js

@@ -27,13 +27,17 @@ describe('vaadin-confirm-dialog', () => {
     await expect(dialog).dom.to.equalSnapshot(SNAPSHOT_CONFIG);
   });
 
-  it('overlay', async () => {
-    await expect(overlay).dom.to.equalSnapshot(SNAPSHOT_CONFIG);
+  it('shadow', async () => {
+    await expect(dialog).shadowDom.to.equalSnapshot(SNAPSHOT_CONFIG);
   });
 
-  it('overlay theme', async () => {
+  it('theme', async () => {
     dialog.setAttribute('theme', 'custom');
     await nextUpdate(dialog);
-    await expect(overlay).dom.to.equalSnapshot(SNAPSHOT_CONFIG);
+    await expect(dialog).shadowDom.to.equalSnapshot(SNAPSHOT_CONFIG);
+  });
+
+  it('overlay', async () => {
+    await expect(overlay).shadowDom.to.equalSnapshot(SNAPSHOT_CONFIG);
   });
 });