describe('Performance', ()=>{
  beforeEach(() => {
    cy.visit('https://REDACTED-HOST/files');
    cy.login();
    cy.visit('https://REDACTED-HOST/files');
    cy.url().should('include', 'files');
    cy.contains('li', 'COMPARE').click();
  });

  it('Enter Compare', () => {
    const dataTransfer = new DataTransfer();

    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);
    // // 斷言排序
    // // 斷言狀態欄
    // // 斷言頁面中有 7 個 canvas 元素
    cy.get('canvas').should('have.length', 7);
  });

  it('Anchor', () => {
    // enter Map
    cy.url().should('include', 'files');
    cy.get('#compareFile0').drag('#primaryDragCard');
    cy.get('#compareFile1').drag('#secondaryDragCard');
    cy.contains('button', 'Compare').click();
    cy.contains('h2', 'COMPARE');
    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');
  });
})