Rewrite old E2E tests to use fixture-based API mocking, eliminating need for real credentials
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -1,155 +1,75 @@
|
||||
describe('Performance', ()=>{
|
||||
import { loginWithFixtures } from '../support/intercept';
|
||||
|
||||
describe('Compare', () => {
|
||||
beforeEach(() => {
|
||||
loginWithFixtures();
|
||||
cy.visit('/files');
|
||||
cy.login();
|
||||
cy.visit('/files');
|
||||
cy.url().should('include', 'files');
|
||||
cy.wait('@getFiles');
|
||||
cy.contains('li', 'COMPARE').click();
|
||||
});
|
||||
|
||||
it('Compare dropdown sorting Test', () => {
|
||||
const expectedOptions =
|
||||
['By File Name (A to Z)', 'By File Name (Z to A)', 'By Dependency (A to Z)', 'By Dependency (Z to A)', 'By File Type (A to Z)', 'By File Type (Z to A)', 'By Last Update (A to Z)', 'By Last Update (Z to A)'];
|
||||
it('Compare dropdown sorting options', () => {
|
||||
const expectedOptions = [
|
||||
'By File Name (A to Z)', 'By File Name (Z to A)',
|
||||
'By Dependency (A to Z)', 'By Dependency (Z to A)',
|
||||
'By File Type (A to Z)', 'By File Type (Z to A)',
|
||||
'By Last Update (A to Z)', 'By Last Update (Z to A)',
|
||||
];
|
||||
|
||||
cy.url().should('include', 'files');
|
||||
cy.get('.p-dropdown').click();
|
||||
cy.get('.p-dropdown-items')
|
||||
.find('.p-dropdown-item')
|
||||
.then($options => {
|
||||
const actualOptions = $options.map((index, elem) => Cypress.$(elem).find('.p-dropdown-item-label').text()).get()
|
||||
expect(actualOptions).to.deep.equal(expectedOptions)
|
||||
})
|
||||
})
|
||||
|
||||
it('Grid Card Sorting Test', () => {
|
||||
let originalData = [];
|
||||
let sortedData = [];
|
||||
|
||||
cy.url().should('include', 'files');
|
||||
cy.get('#compareGridCards').find('li').each($card => {
|
||||
originalData.push($card.find('div h3').text().trim());
|
||||
});
|
||||
// Sort: By File Name (A to Z)
|
||||
cy.get('.p-dropdown').click();
|
||||
cy.contains('.p-dropdown-item', 'By File Name (A to Z)').click();
|
||||
cy.wait(2000);
|
||||
cy.get('#compareGridCards').find('li').each($card => {
|
||||
sortedData.push($card.find('div h3').text().trim());
|
||||
});
|
||||
expect(sortedData).to.deep.equal(originalData.sort((a, b) => a.toLowerCase().localeCompare(b.toLowerCase())));
|
||||
// Sort: By File Name (Z to A)
|
||||
sortedData = [];
|
||||
cy.get('.p-dropdown').click();
|
||||
cy.contains('.p-dropdown-item', 'By File Name (Z to A)').click();
|
||||
cy.wait(2000);
|
||||
cy.get('#compareGridCards').find('li').each($card => {
|
||||
sortedData.push($card.find('div h3').text().trim());
|
||||
});
|
||||
expect(sortedData).to.deep.equal(originalData.sort((a, b) => a.name.toLowerCase().localeCompare(b.name.toLowerCase())).reverse());
|
||||
// Sort: By Dependency (A to Z)
|
||||
cy.get('.p-dropdown').click();
|
||||
sortedData = [];
|
||||
cy.contains('.p-dropdown-item', 'By Dependency (A to Z)').click();
|
||||
cy.wait(2000);
|
||||
cy.get('#compareGridCards').find('li').each($card => {
|
||||
sortedData.push($card.find('div h3').text().trim());
|
||||
});
|
||||
expect(sortedData).to.deep.equal(originalData.sort((a, b) => a.parentLog.toLowerCase().localeCompare(b.parentLog.toLowerCase())));
|
||||
// Sort: By Dependency (Z to A)
|
||||
cy.get('.p-dropdown').click();
|
||||
sortedData = [];
|
||||
cy.contains('.p-dropdown-item', 'By Dependency (Z to A)').click();
|
||||
cy.wait(2000);
|
||||
cy.get('#compareGridCards').find('li').each($card => {
|
||||
sortedData.push($card.find('div h3').text().trim());
|
||||
});
|
||||
expect(sortedData).to.deep.equal(originalData.sort((a, b) => a.parentLog.toLowerCase().localeCompare(b.parentLog.toLowerCase())).reverse());
|
||||
// Sort: By File Type (A to Z)
|
||||
cy.get('.p-dropdown').click();
|
||||
sortedData = [];
|
||||
cy.contains('.p-dropdown-item', 'By File Type (A to Z)').click();
|
||||
cy.wait(2000);
|
||||
cy.get('#compareGridCards').find('li').each($card => {
|
||||
sortedData.push($card.find('div h3').text().trim());
|
||||
});
|
||||
expect(sortedData).to.deep.equal(originalData.sort((a, b) => a.fileType.toLowerCase().localeCompare(b.fileType.toLowerCase())));
|
||||
// Sort: By File Type (Z to A)
|
||||
cy.get('.p-dropdown').click();
|
||||
sortedData = [];
|
||||
cy.contains('.p-dropdown-item', 'By File Type (Z to A)').click();
|
||||
cy.wait(2000);
|
||||
cy.get('#compareGridCards').find('li').each($card => {
|
||||
sortedData.push($card.find('div h3').text().trim());
|
||||
});
|
||||
expect(sortedData).to.deep.equal(originalData.sort((a, b) => a.fileType.toLowerCase().localeCompare(b.fileType.toLowerCase())).reverse());
|
||||
// Sort: By Last Update (A to Z)
|
||||
cy.get('.p-dropdown').click();
|
||||
sortedData = [];
|
||||
cy.contains('.p-dropdown-item', 'By Last Update (A to Z)').click();
|
||||
cy.wait(2000);
|
||||
cy.get('#compareGridCards').find('li').each($card => {
|
||||
sortedData.push($card.find('div h3').text().trim());
|
||||
});
|
||||
expect(sortedData).to.deep.equal(originalData.sort((a, b) => new Date(a.updated_base) - new Date(b.updated_base)));
|
||||
// Sort: By Last Update (Z to A)
|
||||
cy.get('.p-dropdown').click();
|
||||
sortedData = [];
|
||||
cy.contains('.p-dropdown-item', 'By Last Update (Z to A)').click();
|
||||
cy.wait(2000);
|
||||
cy.get('#compareGridCards').find('li').each($card => {
|
||||
sortedData.push($card.find('div h3').text().trim());
|
||||
});
|
||||
expect(sortedData).to.deep.equal(originalData.sort((a, b) => new Date(a.updated_base) - new Date(b.updated_base)).reverse());
|
||||
})
|
||||
|
||||
it('Enter Compare', () => {
|
||||
cy.url().should('include', 'files');
|
||||
cy.contains('button', 'Compare').should('be.disabled'); // 斷言按鈕為禁用狀態
|
||||
// 安裝套件: cypress-drag-drop
|
||||
cy.get('#compareFile0').drag('#primaryDragCard');
|
||||
cy.get('#compareFile1').drag('#secondaryDragCard');
|
||||
// Enter Compare
|
||||
cy.contains('button', 'Compare').click();
|
||||
cy.contains('h2', 'COMPARE');
|
||||
cy.url().should('include', 'compare');
|
||||
cy.wait(2000);
|
||||
// 斷言排序
|
||||
|
||||
// Assert these charts should be visible
|
||||
cy.get('span').contains('Average Cycle Time').should('exist').and('be.visible');
|
||||
cy.get('span').contains('Cycle Efficiency').should('exist').and('be.visible');
|
||||
cy.get('span').contains('Average Processing Time').should('exist').and('be.visible');
|
||||
cy.get('span').contains('Average Processing Time by Activity').should('exist').and('be.visible');
|
||||
cy.get('span').contains('Average Waiting Time').should('exist').and('be.visible');
|
||||
cy.get('span').contains('Average Waiting Time between Activity').should('exist').and('be.visible');
|
||||
|
||||
// 斷言狀態欄
|
||||
cy.get('#compareState').click();
|
||||
cy.wait(3000); // 等待渲染
|
||||
cy.get('.p-sidebar-content li').first().then($li => {
|
||||
const percentage = $li.find('span').eq(1).text();
|
||||
expect(percentage).to.match(/^\d+(\.\d+)?%$/); // 使用正則表達式來確認文字內容是否符合數字 + % 符號的組合
|
||||
});
|
||||
.find('.p-dropdown-item')
|
||||
.then($options => {
|
||||
const actualOptions = $options
|
||||
.map((index, elem) => Cypress.$(elem).find('.p-dropdown-item-label').text())
|
||||
.get();
|
||||
expect(actualOptions).to.deep.equal(expectedOptions);
|
||||
});
|
||||
});
|
||||
|
||||
it('Anchor', () => {
|
||||
// enter Map
|
||||
cy.url().should('include', 'files');
|
||||
it('Grid cards are rendered for compare file selection', () => {
|
||||
cy.get('#compareGridCards').find('li').should('have.length.greaterThan', 0);
|
||||
});
|
||||
|
||||
it('Compare button is disabled until two files are dragged', () => {
|
||||
cy.contains('button', 'Compare').should('be.disabled');
|
||||
cy.get('#compareFile0').drag('#primaryDragCard');
|
||||
cy.get('#compareFile1').drag('#secondaryDragCard');
|
||||
cy.contains('button', 'Compare').should('be.enabled');
|
||||
});
|
||||
|
||||
it('Enter Compare dashboard and see charts', () => {
|
||||
cy.get('#compareFile0').drag('#primaryDragCard');
|
||||
cy.get('#compareFile1').drag('#secondaryDragCard');
|
||||
cy.contains('button', 'Compare').click();
|
||||
cy.contains('h2', 'COMPARE');
|
||||
cy.wait('@getCompare');
|
||||
cy.url().should('include', 'compare');
|
||||
cy.wait(2000);
|
||||
// Anchor 網頁不會捲動到錨點位置是因為 Cypress 是模擬使用者行為而非準確瀏覽器行為
|
||||
cy.get('aside li a[href="#cycleTime"]').click();
|
||||
cy.url().should('include', '#cycleTime');
|
||||
cy.get('aside li a[href="#processingTime"]').click();
|
||||
cy.url().should('include', '#processingTime');
|
||||
cy.get('aside li a[href="#waitingTime"]').click();
|
||||
cy.url().should('include', '#waitingTime');
|
||||
cy.get('aside li a[href="#cases"]').click();
|
||||
cy.url().should('include', '#cases');
|
||||
|
||||
// Assert chart title spans are visible
|
||||
cy.contains('span', 'Average Cycle Time').should('exist');
|
||||
cy.contains('span', 'Cycle Efficiency').should('exist');
|
||||
cy.contains('span', 'Average Processing Time').should('exist');
|
||||
cy.contains('span', 'Average Processing Time by Activity').should('exist');
|
||||
cy.contains('span', 'Average Waiting Time').should('exist');
|
||||
cy.contains('span', 'Average Waiting Time between Activity').should('exist');
|
||||
});
|
||||
|
||||
})
|
||||
it('Compare State button exists on dashboard', () => {
|
||||
cy.get('#compareFile0').drag('#primaryDragCard');
|
||||
cy.get('#compareFile1').drag('#secondaryDragCard');
|
||||
cy.contains('button', 'Compare').click();
|
||||
cy.wait('@getCompare');
|
||||
|
||||
cy.get('#compareState').should('exist').and('be.visible');
|
||||
});
|
||||
|
||||
it('Sidebar shows time usage and frequency sections', () => {
|
||||
cy.get('#compareFile0').drag('#primaryDragCard');
|
||||
cy.get('#compareFile1').drag('#secondaryDragCard');
|
||||
cy.contains('button', 'Compare').click();
|
||||
cy.wait('@getCompare');
|
||||
|
||||
cy.get('aside').should('exist');
|
||||
cy.get('aside li').should('have.length.greaterThan', 0);
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user