diff --git a/packages/editor/cypress.json b/packages/editor/cypress.json
index eb4dad54..48846f2a 100644
--- a/packages/editor/cypress.json
+++ b/packages/editor/cypress.json
@@ -1,6 +1,7 @@
 {
     "video": false,
     "videoUploadOnPasses": false,
-    "baseUrl": "http://localhost:8081"
+    "baseUrl": "http://localhost:8081",
+    "includeShadowDom": true
   }
   
\ No newline at end of file
diff --git a/packages/editor/cypress/integration/playground.test.js b/packages/editor/cypress/integration/playground.test.js
index c5a195c6..d8cd143b 100644
--- a/packages/editor/cypress/integration/playground.test.js
+++ b/packages/editor/cypress/integration/playground.test.js
@@ -13,18 +13,18 @@ context('Playground', () => {
       'icon-sample',
     ].forEach((mapId) => {
       cy.visit(`/viewmode.html?id=${mapId}`);
-      cy.get('#mindplot.ready').should('exist');
+      cy.get('#mindmap-comp.ready').should('exist');
       cy.matchImageSnapshot(`viewmode-${mapId}`);
     });
   });
-  it('the playground container.html page should match its snapshot', () => {
-    cy.visit('/container.html');
-    cy.getIframeBody().find('#mindplot.ready').should('exist');
+  it('the playground showcase.html page should match its snapshot', () => {
+    cy.visit('/showcase.html');
+    cy.getIframeBody().find('#mindmap-comp.ready').should('exist');
     cy.matchImageSnapshot('container');
   });
   it('the playground editor.html page should match its snapshot', () => {
     cy.visit('/editor.html');
-    cy.get('#mindplot.ready').should('exist');
+    cy.get('#mindmap-comp.ready').should('exist');
     // TODO: why is the editor appearing twice in the snapshot?
     cy.matchImageSnapshot('editor');
   });
diff --git a/packages/editor/test/playground/map-render/js/showcase.tsx b/packages/editor/test/playground/map-render/js/showcase.tsx
index 7b862a66..acd5de82 100644
--- a/packages/editor/test/playground/map-render/js/showcase.tsx
+++ b/packages/editor/test/playground/map-render/js/showcase.tsx
@@ -22,7 +22,7 @@ import { LocalStorageManager, Designer } from '@wisemapping/mindplot';
 
 const initialization = (designer: Designer) => {
   designer.addEvent('loadSuccess', () => {
-    const elem = document.getElementById('mindplot');
+    const elem = document.getElementById('mindmap-comp');
     if (elem) {
       elem.classList.add('ready');
     }
diff --git a/packages/editor/test/playground/map-render/js/viewmode.tsx b/packages/editor/test/playground/map-render/js/viewmode.tsx
index 44c73652..bd338610 100644
--- a/packages/editor/test/playground/map-render/js/viewmode.tsx
+++ b/packages/editor/test/playground/map-render/js/viewmode.tsx
@@ -6,7 +6,7 @@ import { LocalStorageManager, Designer } from '@wisemapping/mindplot';
 
 const initialization = (designer: Designer) => {
   designer.addEvent('loadSuccess', () => {
-    const elem = document.getElementById('mindplot');
+    const elem = document.getElementById('mindmap-comp');
     if (elem) {
       elem.classList.add('ready');
     }