Fix show tests

Author: devrnt

packages/react-use-intercom/cypress.config.ts

@@ -1,9 +1,10 @@
 import { defineConfig } from 'cypress';
 
 export default defineConfig({
+  // Enable cross-domain iframe access
+  chromeWebSecurity: false,
   e2e: {
     baseUrl: 'http://localhost:5173/#/',
-    supportFile: 'cypress/support/index.ts',
     video: false,
     specPattern: 'cypress/e2e/**/*.ts',
   },

packages/react-use-intercom/cypress/e2e/boot.ts

@@ -1,3 +1,5 @@
+/// <reference types="cypress" />
+
 describe('boot', () => {
   beforeEach(() => {
     cy.visit('/useIntercom');

packages/react-use-intercom/cypress/e2e/show.ts

@@ -1,13 +1,40 @@
-/// <reference path="../support/index.d.ts" />
+/// <reference types="cypress" />
+
+before(() => {
+  cy.visit('/useIntercom');
+
+  cy.intercept('https://api-iam.intercom.io/messenger/web/ping').as(
+    'intercomPing',
+  );
+  cy.intercept('https://api-iam.intercom.io/messenger/web/open').as(
+    'intercomOpen',
+  );
+  cy.intercept('https://api-iam.intercom.io/messenger/web/metrics').as(
+    'intercomMetrics',
+  );
+  cy.intercept('https://api-iam.intercom.io/messenger/web/home_cards').as(
+    'intercomHomeCards',
+  );
+});
 
 describe('show', () => {
   it('should show when calling `show`', () => {
     cy.visit('/useIntercom');
 
     cy.get('[data-cy=boot]').click();
+    cy.wait('@intercomPing');
 
     cy.get('[data-cy=show]').click();
-    cy.get('.intercom-messenger-frame > iframe').should('be.visible');
+    cy.wait('@intercomOpen');
+    cy.wait('@intercomHomeCards');
+
+    cy.get('iframe[name="intercom-messenger-frame"]')
+      .should('be.visible')
+      .then(($iframe) => {
+        const $body = $iframe.contents().find('body');
+
+        cy.wrap($body).contains('Start a conversation');
+      });
   });
 });
 
@@ -26,28 +53,54 @@ describe('showMessages', () => {
 });
 
 describe('showNewMessage', () => {
-  it('should show new message `showNewMessage`', () => {
+  beforeEach(() => {
+    cy.intercept('https://api-iam.intercom.io/messenger/web/ping').as(
+      'intercomPing',
+    );
+
+    cy.intercept('https://api-iam.intercom.io/messenger/web/open').as(
+      'intercomOpen',
+    );
+    cy.intercept('https://api-iam.intercom.io/messenger/web/metrics').as(
+      'intercomMetrics',
+    );
+
     cy.visit('/useIntercom');
+  });
 
+  it('should show new message `showNewMessage`', () => {
     cy.get('[data-cy=boot]').click();
+    cy.wait('@intercomPing');
 
     cy.get('[data-cy=show-new-messages]').click();
+    cy.wait('@intercomOpen');
+
+    cy.get('iframe[name="intercom-messenger-frame"]')
+      .should('be.visible')
+      .then(($iframe) => {
+        const $body = $iframe.contents().find('body');
 
-    cy.get('[name="intercom-messenger-frame"]')
-      .iframe('[aria-label=Back]')
-      .should('exist');
+        cy.wrap($body).find('[aria-label="Back"]').should('exist');
+      });
   });
 
   it('should show new message with content when calling `showNewMessage`', () => {
-    cy.visit('/useIntercom');
-
     cy.get('[data-cy=boot]').click();
+    cy.wait('@intercomPing');
 
     cy.get('[data-cy=show-messages-content]').click();
-    cy.wait(1000);
+    cy.wait('@intercomOpen');
+
+    cy.get('iframe[name="intercom-messenger-frame"]')
+      .should('be.visible')
+      .then(($iframe) => {
+        const $body = $iframe.contents().find('body');
 
-    cy.get('[name="intercom-messenger-frame"]')
-      .iframe('textarea[name="message"]')
-      .should('exist');
+        cy.wrap($body).find('[aria-label="Back"]').should('exist');
+        cy.wrap($body)
+          .find('textarea[name="message"]')
+          .should('exist')
+          .should('have.value', 'pre-definded-content');
+      });
   });
 });