简体   繁体   中英

How to create a lib that depends on Cypress without installing Cypress itself?

We're using the page object pattern in our test and recently decided to move them into a separate npm-published lib for reusability.

Of course, as Cypress is pretty heavy and due to possible version conflicts the best idea (IMO) is not to install Cypress in the lib and list it only among peerDependencies. To overcome typing issues (we use TS), I created some types (tried both d.ts and ts extensions) for Cypress commands like this:

Options.ts

export interface Options {
    log: boolean;
    timeout: number;
    withinSubject: null | HTMLElement;
    includeShadowDom: boolean;
}

global.ts

import { Options } from './Options';
export declare namespace cy {
    function get(selector: string, options?: Partial<Options>): Cypress.Chainable<JQuery<HTMLElement>>;
    function find(selector: string, options?: Partial<Options>): Cypress.Chainable<JQuery<HTMLElement>>;
}
export declare namespace Cypress {
    interface Chainable<Subject> {
        find(selector: string, options?: Partial<Options>): Chainable<JQuery<HTMLElement>>;
        eq(index: number, options?: Partial<Options>): Chainable<JQuery<HTMLElement>>;
        next(selector?: string, options?: Partial<Options>): Chainable<JQuery<HTMLElement>>;
    }
}
export declare interface JQuery<Subject> {
}

Eventually, when I use the lib in my tests, nothing seems to work and I keep getting this error:

 Error: Webpack Compilation Error '../path/file.js' Module not found: Error: Can't resolve 'core-js/modules/es6.array.find' in 'path/dist/fileHoldingFolder' Parsed request is a module using description in file 'path/package.json' (relative path: 'dist/fileHoldingFolder') Field 'browser' doesn't contain a valid alias configuration *Here goes a long list of paths in node_modules*

(The lib was included via npm link libname)

For creating the lib in Typescript, I followed this instruction
The only change is that I set target to 'ES2015' and added some strict settings.

Now I'm out of ideas and maybe there's someone who tried implementing this out there and can help. Much appreciated

Well, I can answer this myself. The way to go was to just add 'cypress' to the devDependencies:)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM