Skip to content

Commit 2b31308

Browse files
ScriptedAlchemyScriptedAlchemy
committed
fix: add e2e tests
1 parent 3321fa6 commit 2b31308

File tree

2 files changed

+185
-71
lines changed

2 files changed

+185
-71
lines changed

‎runtime-plugins/single-runtime/e2e/checkAutomaticVendorApps.cy.ts

Lines changed: 183 additions & 69 deletions
Original file line numberDiff line numberDiff line change
@@ -5,74 +5,188 @@ import { CssAttr } from '../../../cypress-e2e/types/cssAttr';
55

66
const basePage: BaseMethods = new BaseMethods();
77

8-
const appButtonPosition: number = 0;
9-
10-
const appsData = [
11-
{
12-
headerSelector: baseSelectors.tags.headers.h1,
13-
subHeaderSelector: baseSelectors.tags.headers.h2,
14-
buttonSelector: baseSelectors.tags.coreElements.button,
15-
headerText: 'Single Runtime',
16-
appNameText: Constants.commonConstantsData.commonCountAppNames.app1,
17-
buttonColor: Constants.color.red,
18-
host: 3001,
19-
},
20-
];
21-
22-
appsData.forEach(
23-
(property: {
24-
headerSelector: string;
25-
subHeaderSelector: string;
26-
buttonSelector: string;
27-
headerText: string;
28-
appNameText: string;
29-
buttonColor: string;
30-
host: number;
31-
}) => {
32-
const host = property.host === 3002 ? appsData[1].host : appsData[0].host;
33-
const appName = property.host === 3002 ? appsData[1].appNameText : appsData[0].appNameText;
34-
const color = property.host === 3002 ? appsData[1].buttonColor : appsData[0].buttonColor;
35-
36-
describe(`Endpoint Based Remotes`, () => {
37-
context(`Check ${appName}:${host}`, () => {
38-
beforeEach(() => {
39-
basePage.openLocalhost({
40-
number: host,
41-
});
42-
});
43-
44-
it(`Check ${appName} header and subheader exist on the page`, () => {
45-
basePage.checkElementWithTextPresence({
46-
selector: property.headerSelector,
47-
text: property.headerText,
48-
});
49-
// basePage.checkElementWithTextPresence({
50-
// selector: property.subHeaderSelector,
51-
// text: `${appName}`,
52-
// });
53-
});
54-
55-
it(`Check buttons in ${appName} exist`, () => {
56-
basePage.checkElementWithTextPresence({
57-
selector: property.buttonSelector,
58-
text: `${appName} ${Constants.commonConstantsData.button}`,
59-
});
60-
});
61-
62-
it(`Check button property in ${appName}`, () => {
63-
basePage.checkElementContainText({
64-
selector: property.buttonSelector,
65-
text: `${appName} ${Constants.commonConstantsData.button}`,
66-
index: appButtonPosition,
67-
});
68-
basePage.checkElementHaveProperty({
69-
selector: property.buttonSelector,
70-
text: `${appName} ${Constants.commonConstantsData.button}`,
71-
prop: CssAttr.background,
72-
value: color,
73-
});
74-
});
8+
// Helper function to convert hex to RGB for browser comparison
9+
const hexToRgb = (hex: string): string => {
10+
// Remove # if present
11+
const cleanHex = hex.replace('#', '');
12+
const r = parseInt(cleanHex.slice(0, 2), 16);
13+
const g = parseInt(cleanHex.slice(2, 4), 16);
14+
const b = parseInt(cleanHex.slice(4, 6), 16);
15+
return `rgb(${r}, ${g}, ${b})`;
16+
};
17+
18+
describe('Single Runtime Plugin Example', () => {
19+
describe('App 1 (port 3001)', () => {
20+
beforeEach(() => {
21+
basePage.openLocalhost({
22+
number: 3001,
23+
});
24+
});
25+
26+
it('should have correct title', () => {
27+
basePage.checkElementWithTextPresence({
28+
selector: 'h1',
29+
text: 'App 1 - Single Runtime Demo',
30+
});
31+
});
32+
33+
it('should have explanation section', () => {
34+
cy.get('h3').contains("What's Happening Here?").should('be.visible');
35+
cy.get('div').contains('This is').should('be.visible');
36+
});
37+
38+
it('should have working counter', () => {
39+
cy.contains('Shared State Counter: 0').should('be.visible');
40+
cy.contains('button', 'Increment Counter').click();
41+
cy.contains('Shared State Counter: 1').should('be.visible');
42+
});
43+
44+
it('should have local and remote buttons with correct styling', () => {
45+
// Check local button
46+
cy.get('button')
47+
.contains('App 1 Button')
48+
.should('be.visible')
49+
.should('have.css', 'background-color')
50+
.and('eq', hexToRgb('#4a90e2'));
51+
52+
// Check remote button
53+
cy.get('button')
54+
.contains('App 2 Button')
55+
.should('be.visible')
56+
.should('have.css', 'background-color')
57+
.and('eq', hexToRgb('#e24a90'));
58+
});
59+
60+
it('should have working click counters on buttons', () => {
61+
// Check local button counter
62+
cy.get('button').contains('App 1 Button').as('localButton');
63+
cy.get('@localButton').click();
64+
cy.get('@localButton').should('contain', 'Clicks: 1');
65+
66+
// Check remote button counter
67+
cy.get('button').contains('App 2 Button').as('remoteButton');
68+
cy.get('@remoteButton').click();
69+
cy.get('@remoteButton').should('contain', 'Clicks: 1');
70+
});
71+
72+
it('should show correct runtime information', () => {
73+
cy.contains('Runtime Information:').should('be.visible');
74+
75+
// Check module names are present
76+
cy.contains('Module: app1').should('be.visible');
77+
cy.contains('Module: app2').should('be.visible');
78+
79+
// Check remote entry URLs
80+
cy.contains('div', 'Module: app1')
81+
.parent()
82+
.contains('Remote Entries:')
83+
.parent()
84+
.contains('app2:')
85+
.parent()
86+
.find('code')
87+
.should('contain', 'http://localhost:3002/remoteEntry.js');
88+
89+
cy.contains('div', 'Module: app2')
90+
.parent()
91+
.contains('Remote Entries:')
92+
.parent()
93+
.contains('app1:')
94+
.parent()
95+
.find('code')
96+
.should('contain', 'http://localhost:3001/app1_partial.js');
97+
});
98+
99+
it('should have working navigation between apps', () => {
100+
cy.get('a').contains('Go to App 2')
101+
.should('have.attr', 'href')
102+
.and('include', '3002');
103+
});
104+
});
105+
106+
describe('App 2 (port 3002)', () => {
107+
beforeEach(() => {
108+
basePage.openLocalhost({
109+
number: 3002,
110+
});
111+
});
112+
113+
it('should have correct title', () => {
114+
basePage.checkElementWithTextPresence({
115+
selector: 'h1',
116+
text: 'App 2 - Single Runtime Demo',
75117
});
76118
});
77-
},
78-
);
119+
120+
it('should have explanation section', () => {
121+
cy.get('h3').contains("What's Happening Here?").should('be.visible');
122+
cy.get('div').contains('This is').should('be.visible');
123+
});
124+
125+
it('should have working counter', () => {
126+
cy.contains('Shared State Counter: 0').should('be.visible');
127+
cy.contains('button', 'Increment Counter').click();
128+
cy.contains('Shared State Counter: 1').should('be.visible');
129+
});
130+
131+
it('should have local and remote buttons with correct styling', () => {
132+
// Check local button
133+
cy.get('button')
134+
.contains('App 2 Button')
135+
.should('be.visible')
136+
.should('have.css', 'background-color')
137+
.and('eq', hexToRgb('#e24a90'));
138+
139+
// Check remote button
140+
cy.get('button')
141+
.contains('App 1 Button')
142+
.should('be.visible')
143+
.should('have.css', 'background-color')
144+
.and('eq', hexToRgb('#4a90e2'));
145+
});
146+
147+
it('should have working click counters on buttons', () => {
148+
// Check local button counter
149+
cy.get('button').contains('App 2 Button').as('localButton');
150+
cy.get('@localButton').click();
151+
cy.get('@localButton').should('contain', 'Clicks: 1');
152+
153+
// Check remote button counter
154+
cy.get('button').contains('App 1 Button').as('remoteButton');
155+
cy.get('@remoteButton').click();
156+
cy.get('@remoteButton').should('contain', 'Clicks: 1');
157+
});
158+
159+
it('should show correct runtime information', () => {
160+
cy.contains('Runtime Information:').should('be.visible');
161+
162+
// Check module names are present
163+
cy.contains('Module: app1').should('be.visible');
164+
cy.contains('Module: app2').should('be.visible');
165+
166+
// Check remote entry URLs
167+
cy.contains('div', 'Module: app2')
168+
.parent()
169+
.contains('Remote Entries:')
170+
.parent()
171+
.contains('app1:')
172+
.parent()
173+
.find('code')
174+
.should('contain', 'http://localhost:3001/remoteEntry.js');
175+
176+
cy.contains('div', 'Module: app1')
177+
.parent()
178+
.contains('Remote Entries:')
179+
.parent()
180+
.contains('app2:')
181+
.parent()
182+
.find('code')
183+
.should('contain', 'http://localhost:3002/remoteEntry.js');
184+
});
185+
186+
it('should have working navigation between apps', () => {
187+
cy.get('a').contains('Go to App 1')
188+
.should('have.attr', 'href')
189+
.and('include', '3001');
190+
});
191+
});
192+
});

‎runtime-plugins/single-runtime/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,8 @@
1414
"clean": "pnpm --filter single-runtime_app* --parallel clean",
1515
"legacy:start": "pnpm --filter single-runtime_app* --parallel legacy:start",
1616
"legacy:build": "pnpm --filter single-runtime_app* --parallel legacy:build",
17-
"e2e:ci": "pnpm start & wait-on http-get://localhost:3001/ && npx cypress run --config-file ../../cypress-e2e/config/cypress.config.ts --config '{\"supportFile\": \"../../cypress-e2e/support/e2e.ts\"}' --spec \"./e2e/*.cy.ts\" --browser=chrome",
18-
"legacy:e2e:ci": "pnpm legacy:start & wait-on http-get://localhost:3001/ && npx cypress run --config-file ../../cypress-e2e/config/cypress.config.ts --config '{\"supportFile\": \"../../cypress-e2e/support/e2e.ts\"}' --spec \"./e2e/*.cy.ts\" --browser=chrome"
17+
"e2e:ci": "pnpm start > /dev/null 2>&1 & wait-on http-get://localhost:3001/ && npx cypress run --config-file ../../cypress-e2e/config/cypress.config.ts --config '{\"supportFile\": \"../../cypress-e2e/support/e2e.ts\"}' --spec \"./e2e/*.cy.ts\" --browser=chrome",
18+
"legacy:e2e:ci": "pnpm legacy:start > /dev/null 2>&1 & wait-on http-get://localhost:3001/ && npx cypress run --config-file ../../cypress-e2e/config/cypress.config.ts --config '{\"supportFile\": \"../../cypress-e2e/support/e2e.ts\"}' --spec \"./e2e/*.cy.ts\" --browser=chrome"
1919
},
2020
"devDependencies": {
2121
"wait-on": "7.2.0"

0 commit comments

Comments
 (0)