cypress 13.12.0 → 13.13.0

package/angular-signals/angular-signals/package.json

@@ -0,0 +1,74 @@
+{
+  "name": "@cypress/angular-signals",
+  "version": "0.0.0-development",
+  "description": "Test Angular Components using Signals with Cypress",
+  "main": "dist/index.js",
+  "scripts": {
+    "prebuild": "rimraf dist",
+    "build": "rollup -c rollup.config.mjs",
+    "postbuild": "node ../../scripts/sync-exported-npm-with-cli.js",
+    "check-ts": "tsc --noEmit",
+    "dev": "rollup -c rollup.config.mjs -w",
+    "lint": "eslint --ext .js,.ts,.json, ."
+  },
+  "dependencies": {},
+  "devDependencies": {
+    "@angular/common": "^17.2.0",
+    "@angular/core": "^17.2.0",
+    "@angular/platform-browser-dynamic": "^17.2.0",
+    "@cypress/mount-utils": "0.0.0-development",
+    "typescript": "~5.4.5",
+    "zone.js": "~0.14.6"
+  },
+  "peerDependencies": {
+    "@angular/common": ">=17.2",
+    "@angular/core": ">=17.2",
+    "@angular/platform-browser-dynamic": ">=17.2",
+    "rxjs": ">=7.5.0",
+    "zone.js": ">=0.13.0"
+  },
+  "files": [
+    "dist"
+  ],
+  "types": "dist/index.d.ts",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/cypress-io/cypress.git"
+  },
+  "homepage": "https://github.com/cypress-io/cypress/blob/develop/npm/angular-signals/#readme",
+  "bugs": "https://github.com/cypress-io/cypress/issues/new?assignees=&labels=npm%3A%20%40cypress%2Fangular&template=1-bug-report.md&title=",
+  "keywords": [
+    "angular",
+    "cypress",
+    "cypress-io",
+    "test",
+    "testing"
+  ],
+  "contributors": [
+    {
+      "name": "Bill Glesias",
+      "social": "@atofstryker"
+    }
+  ],
+  "module": "dist/index.js",
+  "publishConfig": {
+    "access": "public"
+  },
+  "nx": {
+    "targets": {
+      "build": {
+        "outputs": [
+          "{workspaceRoot}/cli/angular-signals"
+        ]
+      }
+    }
+  },
+  "standard": {
+    "globals": [
+      "Cypress",
+      "cy",
+      "expect"
+    ]
+  }
+}

package/angular-signals/dist/index.d.ts

@@ -0,0 +1,136 @@
+/// <reference types="cypress" />
+
+import { InputSignal, WritableSignal, 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] extends InputSignal<infer V> ? InputSignal<V> | WritableSignal<V> | V : 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-signals'
+ * 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-signals'
+ *
+ * it('Has spy', () => {
+ *   mount(StepperComponent, { componentProperties: { change: createOutputSpy('changeSpy') } })
+ *   cy.get('[data-cy=increment]').click()
+ *   cy.get('@changeSpy').should('have.been.called')
+ * })
+ *
+ * // Or for use with Angular Signals following the output nomenclature.
+ * // see https://v17.angular.io/guide/model-inputs#differences-between-model-and-input/
+ *
+ * it('Has spy', () => {
+ *   mount(StepperComponent, { componentProperties: { count: signal(0), countChange: createOutputSpy('countChange') } })
+ *   cy.get('[data-cy=increment]').click()
+ *   cy.get('@countChange').should('have.been.called')
+ * })
+ */
+declare const createOutputSpy: <T>(alias: string) => any;
+
+export { CypressTestComponentRenderer, MountConfig, MountResponse, createOutputSpy, mount };