60e2149072
Tasks 16-20: Online Board Tests (Search/Filter, Tabs, Flight List, Details Modal, Time/Date) - Task 16: Search & Filter tests (37 tests) - departure/arrival cities, passenger count, cabin class - Task 17: Arrival/Departure Tabs tests (45 tests) - tab switching, flight display, sorting - Task 18: Flight List View tests (50 tests) - display, sorting, filtering, pagination, loading states - Task 19: Flight Details Modal tests (40 tests) - opening/closing, content display, actions - Task 20: Time & Date Filter tests (43 tests) - date selection, time ranges, calendar navigation Tasks 21-25: Flight Details Tests (Flight Info, Passengers, Seats, Services, Fares) - Task 21: Flight Info Display tests (40 tests) - basic info, airports, route visualization, timeline - Task 22: Passenger Info tests (50 tests) - passenger list, details, services, special requirements - Task 23: Seat Selection tests (50 tests) - seat map, selection, categories, recommendations - Task 24: Service Selection tests (25 tests) - baggage, meals, seats, summary - Task 25: Fare Display tests (55 tests) - fare breakdown, comparisons, discounts, refunds All tests follow AAA pattern and use data-testid selectors matching Angular version. Total: 245 tests across 10 feature suites.
128 lines
4.1 KiB
TypeScript
128 lines
4.1 KiB
TypeScript
/// <reference types="cypress" />
|
|
|
|
import { Type } from '@angular/core';
|
|
import { TestModuleMetadata, ComponentFixture, TestComponentRenderer } from '@angular/core/testing';
|
|
|
|
/**
|
|
* Additional module configurations needed while mounting the component, like
|
|
* providers, declarations, imports and even component @Inputs()
|
|
*
|
|
* @interface MountConfig
|
|
* @see https://angular.io/api/core/testing/TestModuleMetadata
|
|
*/
|
|
interface MountConfig<T> extends TestModuleMetadata {
|
|
/**
|
|
* @memberof MountConfig
|
|
* @description flag to automatically create a cy.spy() for every component @Output() property
|
|
* @example
|
|
* export class ButtonComponent {
|
|
* @Output clicked = new EventEmitter()
|
|
* }
|
|
*
|
|
* cy.mount(ButtonComponent, { autoSpyOutputs: true })
|
|
* cy.get('@clickedSpy).should('have.been.called')
|
|
*/
|
|
autoSpyOutputs?: boolean;
|
|
/**
|
|
* @memberof MountConfig
|
|
* @description flag defaulted to true to automatically detect changes in your components
|
|
*/
|
|
autoDetectChanges?: boolean;
|
|
/**
|
|
* @memberof MountConfig
|
|
* @example
|
|
* import { ButtonComponent } from 'button/button.component'
|
|
* it('renders a button with Save text', () => {
|
|
* cy.mount(ButtonComponent, { componentProperties: { text: 'Save' }})
|
|
* cy.get('button').contains('Save')
|
|
* })
|
|
*
|
|
* it('renders a button with a cy.spy() replacing EventEmitter', () => {
|
|
* cy.mount(ButtonComponent, {
|
|
* componentProperties: {
|
|
* clicked: cy.spy().as('mySpy)
|
|
* }
|
|
* })
|
|
* cy.get('button').click()
|
|
* cy.get('@mySpy').should('have.been.called')
|
|
* })
|
|
*/
|
|
componentProperties?: Partial<{
|
|
[P in keyof T]: T[P];
|
|
}>;
|
|
}
|
|
/**
|
|
* Type that the `mount` function returns
|
|
* @type MountResponse<T>
|
|
*/
|
|
type MountResponse<T> = {
|
|
/**
|
|
* Fixture for debugging and testing a component.
|
|
*
|
|
* @memberof MountResponse
|
|
* @see https://angular.io/api/core/testing/ComponentFixture
|
|
*/
|
|
fixture: ComponentFixture<T>;
|
|
/**
|
|
* The instance of the root component class
|
|
*
|
|
* @memberof MountResponse
|
|
* @see https://angular.io/api/core/testing/ComponentFixture#componentInstance
|
|
*/
|
|
component: T;
|
|
};
|
|
declare class CypressTestComponentRenderer extends TestComponentRenderer {
|
|
insertRootElement(rootElId: string): void;
|
|
removeAllRootElements(): void;
|
|
}
|
|
/**
|
|
* Mounts an Angular component inside Cypress browser
|
|
*
|
|
* @param component Angular component being mounted or its template
|
|
* @param config configuration used to configure the TestBed
|
|
* @example
|
|
* import { mount } from '@cypress/angular'
|
|
* import { StepperComponent } from './stepper.component'
|
|
* import { MyService } from 'services/my.service'
|
|
* import { SharedModule } from 'shared/shared.module';
|
|
* it('mounts', () => {
|
|
* mount(StepperComponent, {
|
|
* providers: [MyService],
|
|
* imports: [SharedModule]
|
|
* })
|
|
* cy.get('[data-cy=increment]').click()
|
|
* cy.get('[data-cy=counter]').should('have.text', '1')
|
|
* })
|
|
*
|
|
* // or
|
|
*
|
|
* it('mounts with template', () => {
|
|
* mount('<app-stepper></app-stepper>', {
|
|
* declarations: [StepperComponent],
|
|
* })
|
|
* })
|
|
*
|
|
* @see {@link https://on.cypress.io/mounting-angular} for more details.
|
|
*
|
|
* @returns A component and component fixture
|
|
*/
|
|
declare function mount<T>(component: Type<T> | string, config?: MountConfig<T>): Cypress.Chainable<MountResponse<T>>;
|
|
/**
|
|
* Creates a new Event Emitter and then spies on it's `emit` method
|
|
*
|
|
* @param {string} alias name you want to use for your cy.spy() alias
|
|
* @returns EventEmitter<T>
|
|
* @example
|
|
* import { StepperComponent } from './stepper.component'
|
|
* import { mount, createOutputSpy } from '@cypress/angular'
|
|
*
|
|
* it('Has spy', () => {
|
|
* mount(StepperComponent, { componentProperties: { change: createOutputSpy('changeSpy') } })
|
|
* cy.get('[data-cy=increment]').click()
|
|
* cy.get('@changeSpy').should('have.been.called')
|
|
* })
|
|
*/
|
|
declare const createOutputSpy: <T>(alias: string) => any;
|
|
|
|
export { CypressTestComponentRenderer, MountConfig, MountResponse, createOutputSpy, mount };
|