cypress 13.11.0 → 13.13.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/angular/angular/dist/index.d.ts +1 -2
- package/angular/angular/dist/index.js +239 -239
- package/angular/angular/package.json +1 -1
- package/angular/dist/index.d.ts +1 -2
- package/angular/dist/index.js +239 -239
- package/angular/package.json +1 -1
- package/angular-signals/README.md +11 -0
- package/angular-signals/angular-signals/README.md +11 -0
- package/angular-signals/angular-signals/dist/index.d.ts +136 -0
- package/angular-signals/angular-signals/dist/index.js +1861 -0
- package/angular-signals/angular-signals/package.json +74 -0
- package/angular-signals/dist/index.d.ts +136 -0
- package/angular-signals/dist/index.js +1861 -0
- package/angular-signals/package.json +74 -0
- package/lib/cli.js +0 -1
- package/lib/exec/xvfb.js +0 -1
- package/lib/logger.js +0 -3
- package/mount-utils/dist/index.d.ts +1 -1
- package/mount-utils/mount-utils/dist/index.d.ts +1 -1
- package/mount-utils/mount-utils/package.json +1 -1
- package/mount-utils/package.json +1 -1
- package/package.json +11 -5
- package/react/dist/cypress-react.cjs.js +237 -237
- package/react/dist/cypress-react.esm-bundler.js +237 -237
- package/react/dist/index.d.ts +1 -1
- package/react/package.json +3 -3
- package/react/react/dist/cypress-react.cjs.js +237 -237
- package/react/react/dist/cypress-react.esm-bundler.js +237 -237
- package/react/react/dist/index.d.ts +1 -1
- package/react/react/package.json +3 -3
- package/react18/dist/cypress-react.cjs.js +222 -222
- package/react18/dist/cypress-react.esm-bundler.js +222 -222
- package/react18/dist/index.d.ts +1 -1
- package/react18/package.json +1 -1
- package/react18/react18/dist/cypress-react.cjs.js +222 -222
- package/react18/react18/dist/cypress-react.esm-bundler.js +222 -222
- package/react18/react18/dist/index.d.ts +1 -1
- package/react18/react18/package.json +1 -1
- package/svelte/dist/cypress-svelte.cjs.js +61 -61
- package/svelte/dist/cypress-svelte.esm-bundler.js +61 -61
- package/svelte/dist/index.d.ts +2 -2
- package/svelte/package.json +1 -1
- package/svelte/svelte/dist/cypress-svelte.cjs.js +61 -61
- package/svelte/svelte/dist/cypress-svelte.esm-bundler.js +61 -61
- package/svelte/svelte/dist/index.d.ts +2 -2
- package/svelte/svelte/package.json +1 -1
- package/vue/dist/cypress-vue.cjs.js +128 -128
- package/vue/dist/cypress-vue.esm-bundler.js +128 -128
- package/vue/dist/index.d.ts +5 -5
- package/vue/package.json +5 -5
- package/vue/vue/dist/cypress-vue.cjs.js +128 -128
- package/vue/vue/dist/cypress-vue.esm-bundler.js +128 -128
- package/vue/vue/dist/index.d.ts +5 -5
- package/vue/vue/package.json +5 -5
- package/vue2/dist/cypress-vue2.cjs.js +211 -211
- package/vue2/dist/cypress-vue2.esm-bundler.js +211 -211
- package/vue2/dist/index.d.ts +11 -11
- package/vue2/package.json +1 -1
- package/vue2/vue2/dist/cypress-vue2.cjs.js +211 -211
- package/vue2/vue2/dist/cypress-vue2.esm-bundler.js +211 -211
- package/vue2/vue2/dist/index.d.ts +11 -11
- package/vue2/vue2/package.json +1 -1
@@ -8454,134 +8454,134 @@ var _VueTestUtils = /*#__PURE__*/Object.freeze({
|
|
8454
8454
|
shallowMount: shallowMount$1
|
8455
8455
|
});
|
8456
8456
|
|
8457
|
-
const {
|
8458
|
-
// We do not expose the `mount` from VueTestUtils, instead, we wrap it and expose a
|
8459
|
-
// Cypress-compatible `mount` API.
|
8460
|
-
mount: VTUmount,
|
8461
|
-
// We do not expose shallowMount. It doesn't make much sense in the context of Cypress.
|
8462
|
-
// It might be useful for people who like to migrate some Test Utils tests to Cypress,
|
8463
|
-
// so if we decide it is useful to expose, just remove the next line, and it will be
|
8464
|
-
// available on the `VueTestUtils` import.
|
8465
|
-
shallowMount } = _VueTestUtils, VueTestUtils = __rest(_VueTestUtils, ["mount", "shallowMount"]);
|
8466
|
-
const DEFAULT_COMP_NAME = 'unknown';
|
8467
|
-
const VUE_ROOT = '__cy_vue_root';
|
8468
|
-
const cleanup = () => {
|
8469
|
-
var _a;
|
8470
|
-
(_a = Cypress.vueWrapper) === null || _a === void 0 ? void 0 : _a.unmount();
|
8471
|
-
Cypress.$(`#${VUE_ROOT}`).remove();
|
8472
|
-
Cypress.vueWrapper = null;
|
8473
|
-
Cypress.vue = null;
|
8474
|
-
};
|
8475
|
-
/**
|
8476
|
-
* Mounts a component and returns an object containing the component and VueWrapper
|
8477
|
-
* @param componentOptions
|
8478
|
-
* @param options
|
8479
|
-
* @returns {Cypress.Chainable<{wrapper: VueWrapper<T>, component: T}>}
|
8480
|
-
* @see {@link https://on.cypress.io/mounting-vue} for more details.
|
8481
|
-
* @example
|
8482
|
-
* import { mount } from '@cypress/vue'
|
8483
|
-
* import { Stepper } from './Stepper.vue'
|
8484
|
-
*
|
8485
|
-
* it('mounts', () => {
|
8486
|
-
* cy.mount(Stepper)
|
8487
|
-
* cy.get('[data-cy=increment]').click()
|
8488
|
-
* cy.get('[data-cy=counter]').should('have.text', '1')
|
8489
|
-
* })
|
8490
|
-
*/
|
8491
|
-
function mount(componentOptions, options = {}) {
|
8492
|
-
checkForRemovedStyleOptions(options);
|
8493
|
-
// Remove last mounted component if cy.mount is called more than once in a test
|
8494
|
-
cleanup();
|
8495
|
-
// then wait for cypress to load
|
8496
|
-
return cy.then(() => {
|
8497
|
-
var _a, _b;
|
8498
|
-
// @ts-ignore
|
8499
|
-
const document = cy.state('document');
|
8500
|
-
const el = getContainerEl();
|
8501
|
-
// merge the extensions with global
|
8502
|
-
if (options.extensions) {
|
8503
|
-
options.extensions.plugins = (_a = []) === null || _a === void 0 ? void 0 : _a.concat(options.extensions.plugins || [], options.extensions.use || []);
|
8504
|
-
options.extensions.mixins = (_b = []) === null || _b === void 0 ? void 0 : _b.concat(options.extensions.mixins || [], options.extensions.mixin || []);
|
8505
|
-
options.global = Object.assign(Object.assign({}, options.extensions), options.global);
|
8506
|
-
}
|
8507
|
-
const componentNode = document.createElement('div');
|
8508
|
-
componentNode.id = VUE_ROOT;
|
8509
|
-
el.append(componentNode);
|
8510
|
-
// mount the component using VTU and return the wrapper in Cypress.VueWrapper
|
8511
|
-
const wrapper = VTUmount(componentOptions, Object.assign({ attachTo: componentNode }, options));
|
8512
|
-
Cypress.vueWrapper = wrapper;
|
8513
|
-
Cypress.vue = wrapper.vm;
|
8514
|
-
return cy
|
8515
|
-
.wait(1, { log: false })
|
8516
|
-
.then(() => {
|
8517
|
-
if (options.log !== false) {
|
8518
|
-
// TODO: get the real displayName and props from VTU shallowMount
|
8519
|
-
const message = `<${getComponentDisplayName(componentOptions)} ... />`;
|
8520
|
-
Cypress.log({
|
8521
|
-
name: 'mount',
|
8522
|
-
message: [message],
|
8523
|
-
});
|
8524
|
-
}
|
8525
|
-
const returnVal = {
|
8526
|
-
wrapper,
|
8527
|
-
component: wrapper.vm,
|
8528
|
-
};
|
8529
|
-
return new Proxy(Object.create(returnVal), {
|
8530
|
-
get(obj, prop) {
|
8531
|
-
// throw an error if it looks like the caller is trying to call a method on the VueWrapper that was originally returned
|
8532
|
-
if (Reflect.get(wrapper, prop)) {
|
8533
|
-
// @ts-expect-error - internal API
|
8534
|
-
Cypress.utils.throwErrByPath('mount.vue_yielded_value');
|
8535
|
-
}
|
8536
|
-
return Reflect.get(obj, prop);
|
8537
|
-
},
|
8538
|
-
});
|
8539
|
-
});
|
8540
|
-
});
|
8541
|
-
}
|
8542
|
-
/**
|
8543
|
-
* Extract the component name from the object passed to mount
|
8544
|
-
* @param componentOptions the component passed to mount
|
8545
|
-
* @returns name of the component
|
8546
|
-
*/
|
8547
|
-
function getComponentDisplayName(componentOptions) {
|
8548
|
-
var _a;
|
8549
|
-
if (componentOptions.name) {
|
8550
|
-
return componentOptions.name;
|
8551
|
-
}
|
8552
|
-
if (componentOptions.__file) {
|
8553
|
-
const filepathSplit = componentOptions.__file.split('/');
|
8554
|
-
const fileName = (_a = filepathSplit[filepathSplit.length - 1]) !== null && _a !== void 0 ? _a : DEFAULT_COMP_NAME;
|
8555
|
-
// remove the extension .js, .ts or .vue from the filename to get the name of the component
|
8556
|
-
const baseFileName = fileName.replace(/\.(js|ts|vue)?$/, '');
|
8557
|
-
// if the filename is index, then we can use the direct parent foldername, else use the name itself
|
8558
|
-
return (baseFileName === 'index' ? filepathSplit[filepathSplit.length - 2] : baseFileName);
|
8559
|
-
}
|
8560
|
-
return DEFAULT_COMP_NAME;
|
8561
|
-
}
|
8562
|
-
/**
|
8563
|
-
* Helper function for mounting a component quickly in test hooks.
|
8564
|
-
* @example
|
8565
|
-
* import {mountCallback} from '@cypress/vue'
|
8566
|
-
* beforeEach(mountVue(component, options))
|
8567
|
-
*
|
8568
|
-
* Removed as of Cypress 11.0.0.
|
8569
|
-
* @see https://on.cypress.io/migration-11-0-0-component-testing-updates
|
8570
|
-
*/
|
8571
|
-
function mountCallback(component, options = {}) {
|
8572
|
-
return () => {
|
8573
|
-
// @ts-expect-error - undocumented API
|
8574
|
-
Cypress.utils.throwErrByPath('mount.mount_callback');
|
8575
|
-
};
|
8576
|
-
}
|
8577
|
-
// Side effects from "import { mount } from '@cypress/<my-framework>'" are annoying, we should avoid doing this
|
8578
|
-
// by creating an explicit function/import that the user can register in their 'component.js' support file,
|
8579
|
-
// such as:
|
8580
|
-
// import 'cypress/<my-framework>/support'
|
8581
|
-
// or
|
8582
|
-
// import { registerCT } from 'cypress/<my-framework>'
|
8583
|
-
// registerCT()
|
8584
|
-
// Note: This would be a breaking change
|
8457
|
+
const {
|
8458
|
+
// We do not expose the `mount` from VueTestUtils, instead, we wrap it and expose a
|
8459
|
+
// Cypress-compatible `mount` API.
|
8460
|
+
mount: VTUmount,
|
8461
|
+
// We do not expose shallowMount. It doesn't make much sense in the context of Cypress.
|
8462
|
+
// It might be useful for people who like to migrate some Test Utils tests to Cypress,
|
8463
|
+
// so if we decide it is useful to expose, just remove the next line, and it will be
|
8464
|
+
// available on the `VueTestUtils` import.
|
8465
|
+
shallowMount } = _VueTestUtils, VueTestUtils = __rest(_VueTestUtils, ["mount", "shallowMount"]);
|
8466
|
+
const DEFAULT_COMP_NAME = 'unknown';
|
8467
|
+
const VUE_ROOT = '__cy_vue_root';
|
8468
|
+
const cleanup = () => {
|
8469
|
+
var _a;
|
8470
|
+
(_a = Cypress.vueWrapper) === null || _a === void 0 ? void 0 : _a.unmount();
|
8471
|
+
Cypress.$(`#${VUE_ROOT}`).remove();
|
8472
|
+
Cypress.vueWrapper = null;
|
8473
|
+
Cypress.vue = null;
|
8474
|
+
};
|
8475
|
+
/**
|
8476
|
+
* Mounts a component and returns an object containing the component and VueWrapper
|
8477
|
+
* @param componentOptions
|
8478
|
+
* @param options
|
8479
|
+
* @returns {Cypress.Chainable<{wrapper: VueWrapper<T>, component: T}>}
|
8480
|
+
* @see {@link https://on.cypress.io/mounting-vue} for more details.
|
8481
|
+
* @example
|
8482
|
+
* import { mount } from '@cypress/vue'
|
8483
|
+
* import { Stepper } from './Stepper.vue'
|
8484
|
+
*
|
8485
|
+
* it('mounts', () => {
|
8486
|
+
* cy.mount(Stepper)
|
8487
|
+
* cy.get('[data-cy=increment]').click()
|
8488
|
+
* cy.get('[data-cy=counter]').should('have.text', '1')
|
8489
|
+
* })
|
8490
|
+
*/
|
8491
|
+
function mount(componentOptions, options = {}) {
|
8492
|
+
checkForRemovedStyleOptions(options);
|
8493
|
+
// Remove last mounted component if cy.mount is called more than once in a test
|
8494
|
+
cleanup();
|
8495
|
+
// then wait for cypress to load
|
8496
|
+
return cy.then(() => {
|
8497
|
+
var _a, _b;
|
8498
|
+
// @ts-ignore
|
8499
|
+
const document = cy.state('document');
|
8500
|
+
const el = getContainerEl();
|
8501
|
+
// merge the extensions with global
|
8502
|
+
if (options.extensions) {
|
8503
|
+
options.extensions.plugins = (_a = []) === null || _a === void 0 ? void 0 : _a.concat(options.extensions.plugins || [], options.extensions.use || []);
|
8504
|
+
options.extensions.mixins = (_b = []) === null || _b === void 0 ? void 0 : _b.concat(options.extensions.mixins || [], options.extensions.mixin || []);
|
8505
|
+
options.global = Object.assign(Object.assign({}, options.extensions), options.global);
|
8506
|
+
}
|
8507
|
+
const componentNode = document.createElement('div');
|
8508
|
+
componentNode.id = VUE_ROOT;
|
8509
|
+
el.append(componentNode);
|
8510
|
+
// mount the component using VTU and return the wrapper in Cypress.VueWrapper
|
8511
|
+
const wrapper = VTUmount(componentOptions, Object.assign({ attachTo: componentNode }, options));
|
8512
|
+
Cypress.vueWrapper = wrapper;
|
8513
|
+
Cypress.vue = wrapper.vm;
|
8514
|
+
return cy
|
8515
|
+
.wait(1, { log: false })
|
8516
|
+
.then(() => {
|
8517
|
+
if (options.log !== false) {
|
8518
|
+
// TODO: get the real displayName and props from VTU shallowMount
|
8519
|
+
const message = `<${getComponentDisplayName(componentOptions)} ... />`;
|
8520
|
+
Cypress.log({
|
8521
|
+
name: 'mount',
|
8522
|
+
message: [message],
|
8523
|
+
});
|
8524
|
+
}
|
8525
|
+
const returnVal = {
|
8526
|
+
wrapper,
|
8527
|
+
component: wrapper.vm,
|
8528
|
+
};
|
8529
|
+
return new Proxy(Object.create(returnVal), {
|
8530
|
+
get(obj, prop) {
|
8531
|
+
// throw an error if it looks like the caller is trying to call a method on the VueWrapper that was originally returned
|
8532
|
+
if (Reflect.get(wrapper, prop)) {
|
8533
|
+
// @ts-expect-error - internal API
|
8534
|
+
Cypress.utils.throwErrByPath('mount.vue_yielded_value');
|
8535
|
+
}
|
8536
|
+
return Reflect.get(obj, prop);
|
8537
|
+
},
|
8538
|
+
});
|
8539
|
+
});
|
8540
|
+
});
|
8541
|
+
}
|
8542
|
+
/**
|
8543
|
+
* Extract the component name from the object passed to mount
|
8544
|
+
* @param componentOptions the component passed to mount
|
8545
|
+
* @returns name of the component
|
8546
|
+
*/
|
8547
|
+
function getComponentDisplayName(componentOptions) {
|
8548
|
+
var _a;
|
8549
|
+
if (componentOptions.name) {
|
8550
|
+
return componentOptions.name;
|
8551
|
+
}
|
8552
|
+
if (componentOptions.__file) {
|
8553
|
+
const filepathSplit = componentOptions.__file.split('/');
|
8554
|
+
const fileName = (_a = filepathSplit[filepathSplit.length - 1]) !== null && _a !== void 0 ? _a : DEFAULT_COMP_NAME;
|
8555
|
+
// remove the extension .js, .ts or .vue from the filename to get the name of the component
|
8556
|
+
const baseFileName = fileName.replace(/\.(js|ts|vue)?$/, '');
|
8557
|
+
// if the filename is index, then we can use the direct parent foldername, else use the name itself
|
8558
|
+
return (baseFileName === 'index' ? filepathSplit[filepathSplit.length - 2] : baseFileName);
|
8559
|
+
}
|
8560
|
+
return DEFAULT_COMP_NAME;
|
8561
|
+
}
|
8562
|
+
/**
|
8563
|
+
* Helper function for mounting a component quickly in test hooks.
|
8564
|
+
* @example
|
8565
|
+
* import {mountCallback} from '@cypress/vue'
|
8566
|
+
* beforeEach(mountVue(component, options))
|
8567
|
+
*
|
8568
|
+
* Removed as of Cypress 11.0.0.
|
8569
|
+
* @see https://on.cypress.io/migration-11-0-0-component-testing-updates
|
8570
|
+
*/
|
8571
|
+
function mountCallback(component, options = {}) {
|
8572
|
+
return () => {
|
8573
|
+
// @ts-expect-error - undocumented API
|
8574
|
+
Cypress.utils.throwErrByPath('mount.mount_callback');
|
8575
|
+
};
|
8576
|
+
}
|
8577
|
+
// Side effects from "import { mount } from '@cypress/<my-framework>'" are annoying, we should avoid doing this
|
8578
|
+
// by creating an explicit function/import that the user can register in their 'component.js' support file,
|
8579
|
+
// such as:
|
8580
|
+
// import 'cypress/<my-framework>/support'
|
8581
|
+
// or
|
8582
|
+
// import { registerCT } from 'cypress/<my-framework>'
|
8583
|
+
// registerCT()
|
8584
|
+
// Note: This would be a breaking change
|
8585
8585
|
setupHooks(cleanup);
|
8586
8586
|
|
8587
8587
|
exports.VueTestUtils = VueTestUtils;
|
@@ -8434,134 +8434,134 @@ var _VueTestUtils = /*#__PURE__*/Object.freeze({
|
|
8434
8434
|
shallowMount: shallowMount$1
|
8435
8435
|
});
|
8436
8436
|
|
8437
|
-
const {
|
8438
|
-
// We do not expose the `mount` from VueTestUtils, instead, we wrap it and expose a
|
8439
|
-
// Cypress-compatible `mount` API.
|
8440
|
-
mount: VTUmount,
|
8441
|
-
// We do not expose shallowMount. It doesn't make much sense in the context of Cypress.
|
8442
|
-
// It might be useful for people who like to migrate some Test Utils tests to Cypress,
|
8443
|
-
// so if we decide it is useful to expose, just remove the next line, and it will be
|
8444
|
-
// available on the `VueTestUtils` import.
|
8445
|
-
shallowMount } = _VueTestUtils, VueTestUtils = __rest(_VueTestUtils, ["mount", "shallowMount"]);
|
8446
|
-
const DEFAULT_COMP_NAME = 'unknown';
|
8447
|
-
const VUE_ROOT = '__cy_vue_root';
|
8448
|
-
const cleanup = () => {
|
8449
|
-
var _a;
|
8450
|
-
(_a = Cypress.vueWrapper) === null || _a === void 0 ? void 0 : _a.unmount();
|
8451
|
-
Cypress.$(`#${VUE_ROOT}`).remove();
|
8452
|
-
Cypress.vueWrapper = null;
|
8453
|
-
Cypress.vue = null;
|
8454
|
-
};
|
8455
|
-
/**
|
8456
|
-
* Mounts a component and returns an object containing the component and VueWrapper
|
8457
|
-
* @param componentOptions
|
8458
|
-
* @param options
|
8459
|
-
* @returns {Cypress.Chainable<{wrapper: VueWrapper<T>, component: T}>}
|
8460
|
-
* @see {@link https://on.cypress.io/mounting-vue} for more details.
|
8461
|
-
* @example
|
8462
|
-
* import { mount } from '@cypress/vue'
|
8463
|
-
* import { Stepper } from './Stepper.vue'
|
8464
|
-
*
|
8465
|
-
* it('mounts', () => {
|
8466
|
-
* cy.mount(Stepper)
|
8467
|
-
* cy.get('[data-cy=increment]').click()
|
8468
|
-
* cy.get('[data-cy=counter]').should('have.text', '1')
|
8469
|
-
* })
|
8470
|
-
*/
|
8471
|
-
function mount(componentOptions, options = {}) {
|
8472
|
-
checkForRemovedStyleOptions(options);
|
8473
|
-
// Remove last mounted component if cy.mount is called more than once in a test
|
8474
|
-
cleanup();
|
8475
|
-
// then wait for cypress to load
|
8476
|
-
return cy.then(() => {
|
8477
|
-
var _a, _b;
|
8478
|
-
// @ts-ignore
|
8479
|
-
const document = cy.state('document');
|
8480
|
-
const el = getContainerEl();
|
8481
|
-
// merge the extensions with global
|
8482
|
-
if (options.extensions) {
|
8483
|
-
options.extensions.plugins = (_a = []) === null || _a === void 0 ? void 0 : _a.concat(options.extensions.plugins || [], options.extensions.use || []);
|
8484
|
-
options.extensions.mixins = (_b = []) === null || _b === void 0 ? void 0 : _b.concat(options.extensions.mixins || [], options.extensions.mixin || []);
|
8485
|
-
options.global = Object.assign(Object.assign({}, options.extensions), options.global);
|
8486
|
-
}
|
8487
|
-
const componentNode = document.createElement('div');
|
8488
|
-
componentNode.id = VUE_ROOT;
|
8489
|
-
el.append(componentNode);
|
8490
|
-
// mount the component using VTU and return the wrapper in Cypress.VueWrapper
|
8491
|
-
const wrapper = VTUmount(componentOptions, Object.assign({ attachTo: componentNode }, options));
|
8492
|
-
Cypress.vueWrapper = wrapper;
|
8493
|
-
Cypress.vue = wrapper.vm;
|
8494
|
-
return cy
|
8495
|
-
.wait(1, { log: false })
|
8496
|
-
.then(() => {
|
8497
|
-
if (options.log !== false) {
|
8498
|
-
// TODO: get the real displayName and props from VTU shallowMount
|
8499
|
-
const message = `<${getComponentDisplayName(componentOptions)} ... />`;
|
8500
|
-
Cypress.log({
|
8501
|
-
name: 'mount',
|
8502
|
-
message: [message],
|
8503
|
-
});
|
8504
|
-
}
|
8505
|
-
const returnVal = {
|
8506
|
-
wrapper,
|
8507
|
-
component: wrapper.vm,
|
8508
|
-
};
|
8509
|
-
return new Proxy(Object.create(returnVal), {
|
8510
|
-
get(obj, prop) {
|
8511
|
-
// throw an error if it looks like the caller is trying to call a method on the VueWrapper that was originally returned
|
8512
|
-
if (Reflect.get(wrapper, prop)) {
|
8513
|
-
// @ts-expect-error - internal API
|
8514
|
-
Cypress.utils.throwErrByPath('mount.vue_yielded_value');
|
8515
|
-
}
|
8516
|
-
return Reflect.get(obj, prop);
|
8517
|
-
},
|
8518
|
-
});
|
8519
|
-
});
|
8520
|
-
});
|
8521
|
-
}
|
8522
|
-
/**
|
8523
|
-
* Extract the component name from the object passed to mount
|
8524
|
-
* @param componentOptions the component passed to mount
|
8525
|
-
* @returns name of the component
|
8526
|
-
*/
|
8527
|
-
function getComponentDisplayName(componentOptions) {
|
8528
|
-
var _a;
|
8529
|
-
if (componentOptions.name) {
|
8530
|
-
return componentOptions.name;
|
8531
|
-
}
|
8532
|
-
if (componentOptions.__file) {
|
8533
|
-
const filepathSplit = componentOptions.__file.split('/');
|
8534
|
-
const fileName = (_a = filepathSplit[filepathSplit.length - 1]) !== null && _a !== void 0 ? _a : DEFAULT_COMP_NAME;
|
8535
|
-
// remove the extension .js, .ts or .vue from the filename to get the name of the component
|
8536
|
-
const baseFileName = fileName.replace(/\.(js|ts|vue)?$/, '');
|
8537
|
-
// if the filename is index, then we can use the direct parent foldername, else use the name itself
|
8538
|
-
return (baseFileName === 'index' ? filepathSplit[filepathSplit.length - 2] : baseFileName);
|
8539
|
-
}
|
8540
|
-
return DEFAULT_COMP_NAME;
|
8541
|
-
}
|
8542
|
-
/**
|
8543
|
-
* Helper function for mounting a component quickly in test hooks.
|
8544
|
-
* @example
|
8545
|
-
* import {mountCallback} from '@cypress/vue'
|
8546
|
-
* beforeEach(mountVue(component, options))
|
8547
|
-
*
|
8548
|
-
* Removed as of Cypress 11.0.0.
|
8549
|
-
* @see https://on.cypress.io/migration-11-0-0-component-testing-updates
|
8550
|
-
*/
|
8551
|
-
function mountCallback(component, options = {}) {
|
8552
|
-
return () => {
|
8553
|
-
// @ts-expect-error - undocumented API
|
8554
|
-
Cypress.utils.throwErrByPath('mount.mount_callback');
|
8555
|
-
};
|
8556
|
-
}
|
8557
|
-
// Side effects from "import { mount } from '@cypress/<my-framework>'" are annoying, we should avoid doing this
|
8558
|
-
// by creating an explicit function/import that the user can register in their 'component.js' support file,
|
8559
|
-
// such as:
|
8560
|
-
// import 'cypress/<my-framework>/support'
|
8561
|
-
// or
|
8562
|
-
// import { registerCT } from 'cypress/<my-framework>'
|
8563
|
-
// registerCT()
|
8564
|
-
// Note: This would be a breaking change
|
8437
|
+
const {
|
8438
|
+
// We do not expose the `mount` from VueTestUtils, instead, we wrap it and expose a
|
8439
|
+
// Cypress-compatible `mount` API.
|
8440
|
+
mount: VTUmount,
|
8441
|
+
// We do not expose shallowMount. It doesn't make much sense in the context of Cypress.
|
8442
|
+
// It might be useful for people who like to migrate some Test Utils tests to Cypress,
|
8443
|
+
// so if we decide it is useful to expose, just remove the next line, and it will be
|
8444
|
+
// available on the `VueTestUtils` import.
|
8445
|
+
shallowMount } = _VueTestUtils, VueTestUtils = __rest(_VueTestUtils, ["mount", "shallowMount"]);
|
8446
|
+
const DEFAULT_COMP_NAME = 'unknown';
|
8447
|
+
const VUE_ROOT = '__cy_vue_root';
|
8448
|
+
const cleanup = () => {
|
8449
|
+
var _a;
|
8450
|
+
(_a = Cypress.vueWrapper) === null || _a === void 0 ? void 0 : _a.unmount();
|
8451
|
+
Cypress.$(`#${VUE_ROOT}`).remove();
|
8452
|
+
Cypress.vueWrapper = null;
|
8453
|
+
Cypress.vue = null;
|
8454
|
+
};
|
8455
|
+
/**
|
8456
|
+
* Mounts a component and returns an object containing the component and VueWrapper
|
8457
|
+
* @param componentOptions
|
8458
|
+
* @param options
|
8459
|
+
* @returns {Cypress.Chainable<{wrapper: VueWrapper<T>, component: T}>}
|
8460
|
+
* @see {@link https://on.cypress.io/mounting-vue} for more details.
|
8461
|
+
* @example
|
8462
|
+
* import { mount } from '@cypress/vue'
|
8463
|
+
* import { Stepper } from './Stepper.vue'
|
8464
|
+
*
|
8465
|
+
* it('mounts', () => {
|
8466
|
+
* cy.mount(Stepper)
|
8467
|
+
* cy.get('[data-cy=increment]').click()
|
8468
|
+
* cy.get('[data-cy=counter]').should('have.text', '1')
|
8469
|
+
* })
|
8470
|
+
*/
|
8471
|
+
function mount(componentOptions, options = {}) {
|
8472
|
+
checkForRemovedStyleOptions(options);
|
8473
|
+
// Remove last mounted component if cy.mount is called more than once in a test
|
8474
|
+
cleanup();
|
8475
|
+
// then wait for cypress to load
|
8476
|
+
return cy.then(() => {
|
8477
|
+
var _a, _b;
|
8478
|
+
// @ts-ignore
|
8479
|
+
const document = cy.state('document');
|
8480
|
+
const el = getContainerEl();
|
8481
|
+
// merge the extensions with global
|
8482
|
+
if (options.extensions) {
|
8483
|
+
options.extensions.plugins = (_a = []) === null || _a === void 0 ? void 0 : _a.concat(options.extensions.plugins || [], options.extensions.use || []);
|
8484
|
+
options.extensions.mixins = (_b = []) === null || _b === void 0 ? void 0 : _b.concat(options.extensions.mixins || [], options.extensions.mixin || []);
|
8485
|
+
options.global = Object.assign(Object.assign({}, options.extensions), options.global);
|
8486
|
+
}
|
8487
|
+
const componentNode = document.createElement('div');
|
8488
|
+
componentNode.id = VUE_ROOT;
|
8489
|
+
el.append(componentNode);
|
8490
|
+
// mount the component using VTU and return the wrapper in Cypress.VueWrapper
|
8491
|
+
const wrapper = VTUmount(componentOptions, Object.assign({ attachTo: componentNode }, options));
|
8492
|
+
Cypress.vueWrapper = wrapper;
|
8493
|
+
Cypress.vue = wrapper.vm;
|
8494
|
+
return cy
|
8495
|
+
.wait(1, { log: false })
|
8496
|
+
.then(() => {
|
8497
|
+
if (options.log !== false) {
|
8498
|
+
// TODO: get the real displayName and props from VTU shallowMount
|
8499
|
+
const message = `<${getComponentDisplayName(componentOptions)} ... />`;
|
8500
|
+
Cypress.log({
|
8501
|
+
name: 'mount',
|
8502
|
+
message: [message],
|
8503
|
+
});
|
8504
|
+
}
|
8505
|
+
const returnVal = {
|
8506
|
+
wrapper,
|
8507
|
+
component: wrapper.vm,
|
8508
|
+
};
|
8509
|
+
return new Proxy(Object.create(returnVal), {
|
8510
|
+
get(obj, prop) {
|
8511
|
+
// throw an error if it looks like the caller is trying to call a method on the VueWrapper that was originally returned
|
8512
|
+
if (Reflect.get(wrapper, prop)) {
|
8513
|
+
// @ts-expect-error - internal API
|
8514
|
+
Cypress.utils.throwErrByPath('mount.vue_yielded_value');
|
8515
|
+
}
|
8516
|
+
return Reflect.get(obj, prop);
|
8517
|
+
},
|
8518
|
+
});
|
8519
|
+
});
|
8520
|
+
});
|
8521
|
+
}
|
8522
|
+
/**
|
8523
|
+
* Extract the component name from the object passed to mount
|
8524
|
+
* @param componentOptions the component passed to mount
|
8525
|
+
* @returns name of the component
|
8526
|
+
*/
|
8527
|
+
function getComponentDisplayName(componentOptions) {
|
8528
|
+
var _a;
|
8529
|
+
if (componentOptions.name) {
|
8530
|
+
return componentOptions.name;
|
8531
|
+
}
|
8532
|
+
if (componentOptions.__file) {
|
8533
|
+
const filepathSplit = componentOptions.__file.split('/');
|
8534
|
+
const fileName = (_a = filepathSplit[filepathSplit.length - 1]) !== null && _a !== void 0 ? _a : DEFAULT_COMP_NAME;
|
8535
|
+
// remove the extension .js, .ts or .vue from the filename to get the name of the component
|
8536
|
+
const baseFileName = fileName.replace(/\.(js|ts|vue)?$/, '');
|
8537
|
+
// if the filename is index, then we can use the direct parent foldername, else use the name itself
|
8538
|
+
return (baseFileName === 'index' ? filepathSplit[filepathSplit.length - 2] : baseFileName);
|
8539
|
+
}
|
8540
|
+
return DEFAULT_COMP_NAME;
|
8541
|
+
}
|
8542
|
+
/**
|
8543
|
+
* Helper function for mounting a component quickly in test hooks.
|
8544
|
+
* @example
|
8545
|
+
* import {mountCallback} from '@cypress/vue'
|
8546
|
+
* beforeEach(mountVue(component, options))
|
8547
|
+
*
|
8548
|
+
* Removed as of Cypress 11.0.0.
|
8549
|
+
* @see https://on.cypress.io/migration-11-0-0-component-testing-updates
|
8550
|
+
*/
|
8551
|
+
function mountCallback(component, options = {}) {
|
8552
|
+
return () => {
|
8553
|
+
// @ts-expect-error - undocumented API
|
8554
|
+
Cypress.utils.throwErrByPath('mount.mount_callback');
|
8555
|
+
};
|
8556
|
+
}
|
8557
|
+
// Side effects from "import { mount } from '@cypress/<my-framework>'" are annoying, we should avoid doing this
|
8558
|
+
// by creating an explicit function/import that the user can register in their 'component.js' support file,
|
8559
|
+
// such as:
|
8560
|
+
// import 'cypress/<my-framework>/support'
|
8561
|
+
// or
|
8562
|
+
// import { registerCT } from 'cypress/<my-framework>'
|
8563
|
+
// registerCT()
|
8564
|
+
// Note: This would be a breaking change
|
8565
8565
|
setupHooks(cleanup);
|
8566
8566
|
|
8567
8567
|
export { VueTestUtils, mount, mountCallback };
|
package/vue/vue/dist/index.d.ts
CHANGED
@@ -1287,7 +1287,7 @@ declare const VueTestUtils: {
|
|
1287
1287
|
createWrapperError: typeof createWrapperError;
|
1288
1288
|
};
|
1289
1289
|
|
1290
|
-
|
1290
|
+
type GlobalMountOptions = Required<MountingOptions$1<any>>['global'];
|
1291
1291
|
declare global {
|
1292
1292
|
namespace Cypress {
|
1293
1293
|
interface Cypress {
|
@@ -1296,7 +1296,7 @@ declare global {
|
|
1296
1296
|
}
|
1297
1297
|
}
|
1298
1298
|
}
|
1299
|
-
|
1299
|
+
type MountingOptions<Props, Data = {}> = Omit<MountingOptions$1<Props, Data>, 'attachTo'> & {
|
1300
1300
|
log?: boolean;
|
1301
1301
|
/**
|
1302
1302
|
* @deprecated use vue-test-utils `global` instead
|
@@ -1306,7 +1306,7 @@ declare type MountingOptions<Props, Data = {}> = Omit<MountingOptions$1<Props, D
|
|
1306
1306
|
mixin?: GlobalMountOptions['mixins'];
|
1307
1307
|
};
|
1308
1308
|
};
|
1309
|
-
|
1309
|
+
type CyMountOptions<Props, Data = {}> = MountingOptions<Props, Data>;
|
1310
1310
|
/**
|
1311
1311
|
* The types for mount have been copied directly from the VTU mount
|
1312
1312
|
* https://github.com/vuejs/vue-test-utils-next/blob/master/src/mount.ts.
|
@@ -1318,8 +1318,8 @@ declare type CyMountOptions<Props, Data = {}> = MountingOptions<Props, Data>;
|
|
1318
1318
|
* `MountOptions` are modifying, including some Cypress specific options like `styles`.
|
1319
1319
|
* The return type is different. Instead of VueWrapper, it's Cypress.Chainable<VueWrapper<...>>.
|
1320
1320
|
*/
|
1321
|
-
|
1322
|
-
|
1321
|
+
type PublicProps = VNodeProps & AllowedComponentProps & ComponentCustomProps;
|
1322
|
+
type ComponentMountingOptions<T> = T extends DefineComponent<infer PropsOrPropOptions, any, infer D, any, any> ? MountingOptions<Partial<ExtractDefaultPropTypes<PropsOrPropOptions>> & Omit<Readonly<ExtractPropTypes<PropsOrPropOptions>> & PublicProps, keyof ExtractDefaultPropTypes<PropsOrPropOptions>>, D> & Record<string, any> : MountingOptions<any>;
|
1323
1323
|
declare function mount<V extends {}>(originalComponent: {
|
1324
1324
|
new (...args: any[]): V;
|
1325
1325
|
__vccOpts: any;
|
package/vue/vue/package.json
CHANGED
@@ -16,7 +16,7 @@
|
|
16
16
|
},
|
17
17
|
"devDependencies": {
|
18
18
|
"@cypress/mount-utils": "0.0.0-development",
|
19
|
-
"@vitejs/plugin-vue": "
|
19
|
+
"@vitejs/plugin-vue": "5.0.4",
|
20
20
|
"@vue/compiler-sfc": "3.2.47",
|
21
21
|
"@vue/test-utils": "2.3.2",
|
22
22
|
"axios": "0.21.2",
|
@@ -24,12 +24,12 @@
|
|
24
24
|
"debug": "^4.3.4",
|
25
25
|
"globby": "^11.0.1",
|
26
26
|
"tailwindcss": "1.1.4",
|
27
|
-
"typescript": "
|
28
|
-
"vite": "
|
27
|
+
"typescript": "~5.4.5",
|
28
|
+
"vite": "5.2.11",
|
29
29
|
"vue": "3.2.47",
|
30
|
-
"vue-i18n": "9.
|
30
|
+
"vue-i18n": "9.13.1",
|
31
31
|
"vue-router": "^4.0.0",
|
32
|
-
"vue-tsc": "^0.
|
32
|
+
"vue-tsc": "^2.0.19",
|
33
33
|
"vuex": "^4.0.0"
|
34
34
|
},
|
35
35
|
"peerDependencies": {
|