54 lines
		
	
	
		
			2.2 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
		
		
			
		
	
	
			54 lines
		
	
	
		
			2.2 KiB
		
	
	
	
		
			JavaScript
		
	
	
	
	
	
|   | const practiceProjectUrls = [ | ||
|  |   '/learn/responsive-web-design/css-variables-skyline/', | ||
|  |   '/learn/responsive-web-design/basic-html-cat-photo-app/', | ||
|  |   '/learn/responsive-web-design/basic-css-cafe-menu/', | ||
|  |   '/learn/responsive-web-design/css-picasso-painting/', | ||
|  |   '/learn/responsive-web-design/css-box-model/', | ||
|  |   '/learn/responsive-web-design/css-piano/', | ||
|  |   '/learn/responsive-web-design/registration-form/', | ||
|  |   '/learn/responsive-web-design/accessibility-quiz/' | ||
|  | ]; | ||
|  | 
 | ||
|  | const legacyFirstChallengeUrls = [ | ||
|  |   '/learn/responsive-web-design/basic-html-and-html5/say-hello-to-html-elements', | ||
|  |   '/learn/responsive-web-design/basic-css/change-the-color-of-text', | ||
|  |   '/learn/responsive-web-design/applied-visual-design/create-visual-balance-using-the-text-align-property', | ||
|  |   '/learn/responsive-web-design/applied-accessibility/add-a-text-alternative-to-images-for-visually-impaired-accessibility', | ||
|  |   '/learn/responsive-web-design/css-flexbox/use-display-flex-to-position-two-boxes', | ||
|  |   '/learn/responsive-web-design/css-grid/create-your-first-css-grid' | ||
|  | ]; | ||
|  | 
 | ||
|  | describe('project preview', () => { | ||
|  |   if (Cypress.env('SHOW_UPCOMING_CHANGES') === 'true') { | ||
|  |     it('should appear on the first challenges of each practice project', () => { | ||
|  |       practiceProjectUrls.forEach(url => { | ||
|  |         cy.visit(url + 'part-1'); | ||
|  |         cy.contains('Complete project demo.'); | ||
|  |         cy.get('[data-cy="project-preview-modal"]').should('be.focused'); | ||
|  |       }); | ||
|  |     }); | ||
|  | 
 | ||
|  |     // Tests for the absence of an element are tricky, if, as is the case here,
 | ||
|  |     // the element is not rendered straight away. So, instead, we test for a
 | ||
|  |     // side effect of not showing the modal: an editor is allowed to get focus.
 | ||
|  |     it('should NOT appear on the second challenges of each practice project', () => { | ||
|  |       practiceProjectUrls.forEach(url => { | ||
|  |         cy.visit(url + 'part-2'); | ||
|  |         cy.focused() | ||
|  |           .parents() | ||
|  |           .should('have.class', 'react-monaco-editor-container'); | ||
|  |       }); | ||
|  |     }); | ||
|  |   } | ||
|  | 
 | ||
|  |   it('should NOT appear on the first challenges of legacy blocks', () => { | ||
|  |     legacyFirstChallengeUrls.forEach(url => { | ||
|  |       cy.visit(url); | ||
|  |       // if no modals are showing, then the editor should have focus:
 | ||
|  |       cy.focused() | ||
|  |         .parents() | ||
|  |         .should('have.class', 'react-monaco-editor-container'); | ||
|  |     }); | ||
|  |   }); | ||
|  | }); |