🖥️ Using VS Code and Cypress for Testing

📁 Understanding the Project Structure

As a QA, you will use VS Code to manage and edit Cypress tests. When you open the Cypress repository in VS Code, you will see test files in the left sidebar, located in:

terminal


cypress/integration/examples

📌 Main Test Files

🅰️ For AI Production Team:
- AIWebsite.PublishedSite.test.js - Front-end tests for the website 🖥️
- AIWebsite.WP-Admin.test.js - WordPress admin panel tests ⚙️
🅱️ For Product Development Team (General Testing):
- AI.DemoSite.test.js - General Tests for the Demo sites ▶️
- AI.MarketingSite.test.js - General Tests for Marketing Sites 📈

✏️ Editing Test Files for Specific Websites

At the top of each test file, you’ll find:

javascript


const websites = [
   { baseUrl: 'url', site: 'Site name', pass: 'password' },
   { baseUrl: 'url', site: 'Site name', pass: 'password' },
   // { baseUrl: 'url', site: 'Site name', pass: 'password'},
]

🔧 How to Modify Websites:

✅ To add a new website:

Follow the format and insert the URL inside the array
Change the site name of the URL
Paste the password for WordPress testing

javascript


{ baseUrl: 'url', site: 'Sitename', pass: 'password' },
{ baseUrl: 'url', site: 'Sitename', pass: 'password' }

✅ To remove a website temporarily:

Comment out the line by adding //. Example:

javascript


{ baseUrl: 'url', site: 'Sitename', pass: 'password' },
// { baseUrl: 'url', site: 'Site name', pass: 'password'}

✅ To remove a website permanently:

Delete the line

javascript


{ baseUrl: 'url', site: 'Sitename', pass: 'password' }

✅ To test only one specific website:

Comment out all other websites except the one you want to test

javascript


{ baseUrl: 'url', site: 'Sitename', pass: 'password' },
// { baseUrl: 'url', site: 'Site name', pass: 'password'},
// { baseUrl: 'url', site: 'Site name', pass: 'password'}

✅ To test all websites:

Ensure all websites are included and not commented out

javascript


{ baseUrl: 'url', site: 'Sitename', pass: 'password' },
{ baseUrl: 'url', site: 'Sitename', pass: 'password' }

💾 Save Your Changes:

Press Ctrl + S or go to File > Save

🔧 How to Modify Test Cases

✅ How to distinguish a test case in VS Code:

Each test case is wrapped inside an it() block. This defines a single test scenario.

javascript


it('Test 1', () => { 
   // Test steps here 
})

✅ To run only specific test cases:

By default, all test cases in the file will run. To execute only certain test cases, add .only to the it() function.

javascript


it.only('Test 1', () => { // This test will run exclusively })
it.only('Test 2', () => { // This test will also run })
it('Test 3', () => { // This test will be skipped })

✅ To revert back and run all test cases:

Remove .only from all test cases.

javascript


it('Test 1', () => { })
it('Test 2', () => { })
it('Test 3', () => { })

💾 Save Your Changes:

Press Ctrl + S or go to File > Save to apply modifications.

📌 Additional Notes

⚡ If Cypress is already open and you want to add or remove a website, you do NOT need to close Cypress!
✅ Simply edit the test file in VS Code, save it, and Cypress will automatically detect the changes and run the updated tests—no need to restart Cypress!
⚠️ CRUCIAL: Always check the Command Log in Cypress to verify test results!