mirror of
				https://github.com/Unleash/unleash.git
				synced 2025-10-27 11:02:16 +01:00 
			
		
		
		
	This PR revamps e2e tests, while adding a new one for the interactive demo guide: - Bumps Cypress from `9.7.0` to `12.11.0`; - Bumps Cypress GH action from `v2` to `v5`; - Makes any adjustments needed; - Fixes a lot of issues identified with existing tests; - Adds new `demo.spec.ts` e2e test that covers the entire demo guide flow; **Note:** Currently does not include `demo.spec.ts` in the GH action, as it [fails](https://github.com/Unleash/unleash/actions/runs/4896839575/jobs/8744137231?pr=3656) on step 2.13 (last step of "user-specific" topic). It runs perfectly fine locally, though. Might be placebo, but in general tests seem less flaky now and they may even be faster (especially when not adding the `demo` one, which would always take a long time).
		
			
				
	
	
		
			131 lines
		
	
	
		
			4.4 KiB
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
			
		
		
	
	
			131 lines
		
	
	
		
			4.4 KiB
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
| ///<reference path="../../global.d.ts" />
 | |
| import { TOPICS } from '../../../src/component/demo/demo-topics';
 | |
| 
 | |
| describe('demo', () => {
 | |
|     const baseUrl = Cypress.config().baseUrl;
 | |
|     const randomId = String(Math.random()).split('.')[1];
 | |
| 
 | |
|     before(() => {
 | |
|         cy.runBefore();
 | |
|         cy.login_UI();
 | |
| 
 | |
|         const optionsIgnore409 = { failOnStatusCode: false };
 | |
| 
 | |
|         cy.createEnvironment_API(
 | |
|             {
 | |
|                 name: 'dev',
 | |
|                 type: 'development',
 | |
|             },
 | |
|             optionsIgnore409
 | |
|         );
 | |
|         cy.createProject_API('demo-app', optionsIgnore409);
 | |
|         cy.createFeature_API('demoApp.step1', 'demo-app', optionsIgnore409);
 | |
|         cy.createFeature_API('demoApp.step2', 'demo-app', optionsIgnore409);
 | |
|         cy.createFeature_API('demoApp.step3', 'demo-app', optionsIgnore409);
 | |
|         cy.createFeature_API('demoApp.step4', 'demo-app', optionsIgnore409);
 | |
|     });
 | |
| 
 | |
|     beforeEach(() => {
 | |
|         cy.login_UI();
 | |
|         cy.visit('/projects');
 | |
|         if (document.querySelector("[data-testid='CLOSE_SPLASH']")) {
 | |
|             cy.get("[data-testid='CLOSE_SPLASH']").click();
 | |
|         }
 | |
| 
 | |
|         cy.intercept('GET', `${baseUrl}/api/admin/ui-config`, req => {
 | |
|             req.headers['cache-control'] =
 | |
|                 'no-cache, no-store, must-revalidate';
 | |
|             req.on('response', res => {
 | |
|                 if (res.body) {
 | |
|                     res.body.flags = {
 | |
|                         ...res.body.flags,
 | |
|                         demo: true,
 | |
|                     };
 | |
|                 }
 | |
|             });
 | |
|         });
 | |
|     });
 | |
| 
 | |
|     afterEach(() => {
 | |
|         cy.intercept('GET', `${baseUrl}/api/admin/ui-config`).as('uiConfig');
 | |
|     });
 | |
| 
 | |
|     after(() => {
 | |
|         cy.request({
 | |
|             method: 'DELETE',
 | |
|             url: `${baseUrl}/api/admin/projects/demo-app/features/demoApp.step1`,
 | |
|         });
 | |
|         cy.request({
 | |
|             method: 'DELETE',
 | |
|             url: `${baseUrl}/api/admin/projects/demo-app/features/demoApp.step2`,
 | |
|         });
 | |
|         cy.request({
 | |
|             method: 'DELETE',
 | |
|             url: `${baseUrl}/api/admin/projects/demo-app/features/demoApp.step3`,
 | |
|         });
 | |
|         cy.request({
 | |
|             method: 'DELETE',
 | |
|             url: `${baseUrl}/api/admin/projects/demo-app/features/demoApp.step4`,
 | |
|         });
 | |
|         cy.request({
 | |
|             method: 'POST',
 | |
|             url: `${baseUrl}/api/admin/projects/demo-app/delete`,
 | |
|             body: {
 | |
|                 features: [
 | |
|                     'demoApp.step1',
 | |
|                     'demoApp.step2',
 | |
|                     'demoApp.step3',
 | |
|                     'demoApp.step4',
 | |
|                 ],
 | |
|             },
 | |
|         });
 | |
|     });
 | |
| 
 | |
|     it('can complete the demo', () => {
 | |
|         cy.get('[data-testid="DEMO_START_BUTTON"]').click();
 | |
| 
 | |
|         for (let topic = 0; topic < TOPICS.length; topic++) {
 | |
|             const currentTopic = TOPICS[topic];
 | |
|             for (let step = 0; step < currentTopic.steps.length; step++) {
 | |
|                 const currentStep = currentTopic.steps[step];
 | |
| 
 | |
|                 cy.task(
 | |
|                     'log',
 | |
|                     `Testing topic #${topic + 1} "${
 | |
|                         currentTopic.title
 | |
|                     }", step #${step + 1}...`
 | |
|                 );
 | |
| 
 | |
|                 if (!currentStep.optional) {
 | |
|                     cy.wait(2000);
 | |
| 
 | |
|                     if (currentStep.nextButton) {
 | |
|                         if (currentStep.focus) {
 | |
|                             if (currentStep.focus === true) {
 | |
|                                 cy.get(currentStep.target as string)
 | |
|                                     .first()
 | |
|                                     .type(randomId, { force: true });
 | |
|                             } else {
 | |
|                                 cy.get(currentStep.target as string)
 | |
|                                     .first()
 | |
|                                     .find(currentStep.focus)
 | |
|                                     .first()
 | |
|                                     .type(randomId, { force: true });
 | |
|                             }
 | |
|                         }
 | |
|                         cy.get('[data-testid="DEMO_NEXT_BUTTON"]').click({
 | |
|                             force: true,
 | |
|                         });
 | |
|                     } else {
 | |
|                         cy.get(currentStep.target as string)
 | |
|                             .first()
 | |
|                             .click({
 | |
|                                 force: true,
 | |
|                             });
 | |
|                     }
 | |
|                 }
 | |
|             }
 | |
|         }
 | |
|     });
 | |
| });
 |