cypress 10.1.0 → 10.3.1

package/vue/dist/cypress-vue.cjs.js

@@ -31,7 +31,7 @@ function _interopNamespace(e) {
 
 var Vue__namespace = /*#__PURE__*/_interopNamespace(Vue);
 
-/*! *****************************************************************************
+/******************************************************************************
 Copyright (c) Microsoft Corporation.
 
 Permission to use, copy, modify, and/or distribute this software for any
@@ -55,7 +55,161 @@ var __assign$1 = function() {
         return t;
     };
     return __assign$1.apply(this, arguments);
+};
+
+function __rest(s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+}
+
+const ROOT_SELECTOR = '[data-cy-root]';
+const getContainerEl = () => {
+    const el = document.querySelector(ROOT_SELECTOR);
+    if (el) {
+        return el;
+    }
+    throw Error(`No element found that matches selector ${ROOT_SELECTOR}. Please add a root element with data-cy-root attribute to your "component-index.html" file so that Cypress can attach your component to the DOM.`);
 };
+/**
+ * Remove any style or extra link elements from the iframe placeholder
+ * left from any previous test
+ *
+ */
+function cleanupStyles() {
+    const styles = document.body.querySelectorAll('[data-cy=injected-style-tag]');
+    styles.forEach((styleElement) => {
+        if (styleElement.parentElement) {
+            styleElement.parentElement.removeChild(styleElement);
+        }
+    });
+    const links = document.body.querySelectorAll('[data-cy=injected-stylesheet]');
+    links.forEach((link) => {
+        if (link.parentElement) {
+            link.parentElement.removeChild(link);
+        }
+    });
+}
+/**
+ * Insert links to external style resources.
+ */
+function insertStylesheets(stylesheets, document, el) {
+    stylesheets.forEach((href) => {
+        const link = document.createElement('link');
+        link.type = 'text/css';
+        link.rel = 'stylesheet';
+        link.href = href;
+        link.dataset.cy = 'injected-stylesheet';
+        document.body.insertBefore(link, el);
+    });
+}
+/**
+ * Inserts a single stylesheet element
+ */
+function insertStyles(styles, document, el) {
+    styles.forEach((style) => {
+        const styleElement = document.createElement('style');
+        styleElement.dataset.cy = 'injected-style-tag';
+        styleElement.appendChild(document.createTextNode(style));
+        document.body.insertBefore(styleElement, el);
+    });
+}
+function insertSingleCssFile(cssFilename, document, el, log) {
+    return cy.readFile(cssFilename, { log }).then((css) => {
+        const style = document.createElement('style');
+        style.appendChild(document.createTextNode(css));
+        document.body.insertBefore(style, el);
+    });
+}
+/**
+ * Reads the given CSS file from local file system
+ * and adds the loaded style text as an element.
+ */
+function insertLocalCssFiles(cssFilenames, document, el, log) {
+    return Cypress.Promise.mapSeries(cssFilenames, (cssFilename) => {
+        return insertSingleCssFile(cssFilename, document, el, log);
+    });
+}
+/**
+ * Injects custom style text or CSS file or 3rd party style resources
+ * into the given document.
+ */
+const injectStylesBeforeElement = (options, document, el) => {
+    if (!el)
+        return;
+    // first insert all stylesheets as Link elements
+    let stylesheets = [];
+    if (typeof options.stylesheet === 'string') {
+        stylesheets.push(options.stylesheet);
+    }
+    else if (Array.isArray(options.stylesheet)) {
+        stylesheets = stylesheets.concat(options.stylesheet);
+    }
+    if (typeof options.stylesheets === 'string') {
+        options.stylesheets = [options.stylesheets];
+    }
+    if (options.stylesheets) {
+        stylesheets = stylesheets.concat(options.stylesheets);
+    }
+    insertStylesheets(stylesheets, document, el);
+    // insert any styles as <style>...</style> elements
+    let styles = [];
+    if (typeof options.style === 'string') {
+        styles.push(options.style);
+    }
+    else if (Array.isArray(options.style)) {
+        styles = styles.concat(options.style);
+    }
+    if (typeof options.styles === 'string') {
+        styles.push(options.styles);
+    }
+    else if (Array.isArray(options.styles)) {
+        styles = styles.concat(options.styles);
+    }
+    insertStyles(styles, document, el);
+    // now load any css files by path and add their content
+    // as <style>...</style> elements
+    let cssFiles = [];
+    if (typeof options.cssFile === 'string') {
+        cssFiles.push(options.cssFile);
+    }
+    else if (Array.isArray(options.cssFile)) {
+        cssFiles = cssFiles.concat(options.cssFile);
+    }
+    if (typeof options.cssFiles === 'string') {
+        cssFiles.push(options.cssFiles);
+    }
+    else if (Array.isArray(options.cssFiles)) {
+        cssFiles = cssFiles.concat(options.cssFiles);
+    }
+    return insertLocalCssFiles(cssFiles, document, el, options.log);
+};
+function setupHooks(optionalCallback) {
+    // Consumed by the framework "mount" libs. A user might register their own mount in the scaffolded 'commands.js'
+    // file that is imported by e2e and component support files by default. We don't want CT side effects to run when e2e
+    // testing so we early return.
+    // System test to verify CT side effects do not pollute e2e: system-tests/test/e2e_with_mount_import_spec.ts
+    if (Cypress.testingType !== 'component') {
+        return;
+    }
+    // When running component specs, we cannot allow "cy.visit"
+    // because it will wipe out our preparation work, and does not make much sense
+    // thus we overwrite "cy.visit" to throw an error
+    Cypress.Commands.overwrite('visit', () => {
+        throw new Error('cy.visit from a component spec is not allowed');
+    });
+    // @ts-ignore
+    Cypress.on('test:before:run', () => {
+        optionalCallback === null || optionalCallback === void 0 ? void 0 : optionalCallback();
+        cleanupStyles();
+    });
+}
 
 /**
  * Make a map and return a function for checking if a key
@@ -6791,7 +6945,12 @@ function stubComponents(stubs, shallow, renderStubDefaultSlot) {
                     throw new Error('Attempted to stub a non-component');
                 }
                 var newStub = createStubOnce(type, function () {
-                    return createStub({
+                    return config.plugins.createStubs
+                        ? config.plugins.createStubs({
+                            name: stubName_1,
+                            component: type
+                        })
+                        : createStub({
                             name: stubName_1,
                             type: type,
                             renderStubDefaultSlot: renderStubDefaultSlot
@@ -13020,6 +13179,30 @@ function processSlot(source, Vue$1) {
     };
 }
 
+var isEnabled = false;
+var wrapperInstances = [];
+function disableAutoUnmount() {
+    isEnabled = false;
+    wrapperInstances.length = 0;
+}
+function enableAutoUnmount(hook) {
+    if (isEnabled) {
+        throw new Error('enableAutoUnmount cannot be called more than once');
+    }
+    isEnabled = true;
+    hook(function () {
+        wrapperInstances.forEach(function (wrapper) {
+            wrapper.unmount();
+        });
+        wrapperInstances.length = 0;
+    });
+}
+function trackInstance(wrapper) {
+    if (!isEnabled)
+        return;
+    wrapperInstances.push(wrapper);
+}
+
 var MOUNT_OPTIONS = [
     'attachTo',
     'attrs',
@@ -13248,8 +13431,12 @@ function mount$1(inputComponent, options) {
     };
     console.warn = warnSave;
     var wrapper = createVueWrapper(app, appRef, setProps);
+    trackInstance(wrapper);
     return wrapper;
 }
+var shallowMount = function (component, options) {
+    return mount$1(component, __assign(__assign({}, options), { shallow: true }));
+};
 
 // match return type of router.resolve: RouteLocation & { href: string }
 var defaultRoute = {
@@ -13265,7 +13452,7 @@ var defaultRoute = {
     href: '/'
 };
 // TODO: Borrow typings from vue-router-next
-Vue.defineComponent({
+var RouterLinkStub = Vue.defineComponent({
     name: 'RouterLinkStub',
     props: {
         to: {
@@ -13295,143 +13482,32 @@ Vue.defineComponent({
     }
 });
 
-typeof setImmediate === 'function' ? setImmediate : setTimeout;
-
-const ROOT_SELECTOR = '[data-cy-root]';
-const getContainerEl = () => {
-    const el = document.querySelector(ROOT_SELECTOR);
-    if (el) {
-        return el;
-    }
-    throw Error(`No element found that matches selector ${ROOT_SELECTOR}. Please use the mount utils to mount it properly`);
-};
-/**
- * Remove any style or extra link elements from the iframe placeholder
- * left from any previous test
- *
- */
-function cleanupStyles() {
-    const styles = document.body.querySelectorAll('[data-cy=injected-style-tag]');
-    styles.forEach((styleElement) => {
-        if (styleElement.parentElement) {
-            styleElement.parentElement.removeChild(styleElement);
-        }
-    });
-    const links = document.body.querySelectorAll('[data-cy=injected-stylesheet]');
-    links.forEach((link) => {
-        if (link.parentElement) {
-            link.parentElement.removeChild(link);
-        }
-    });
-}
-/**
- * Insert links to external style resources.
- */
-function insertStylesheets(stylesheets, document, el) {
-    stylesheets.forEach((href) => {
-        const link = document.createElement('link');
-        link.type = 'text/css';
-        link.rel = 'stylesheet';
-        link.href = href;
-        link.dataset.cy = 'injected-stylesheet';
-        document.body.insertBefore(link, el);
-    });
-}
-/**
- * Inserts a single stylesheet element
- */
-function insertStyles(styles, document, el) {
-    styles.forEach((style) => {
-        const styleElement = document.createElement('style');
-        styleElement.dataset.cy = 'injected-style-tag';
-        styleElement.appendChild(document.createTextNode(style));
-        document.body.insertBefore(styleElement, el);
-    });
-}
-function insertSingleCssFile(cssFilename, document, el, log) {
-    return cy.readFile(cssFilename, { log }).then((css) => {
-        const style = document.createElement('style');
-        style.appendChild(document.createTextNode(css));
-        document.body.insertBefore(style, el);
-    });
-}
-/**
- * Reads the given CSS file from local file system
- * and adds the loaded style text as an element.
- */
-function insertLocalCssFiles(cssFilenames, document, el, log) {
-    return Cypress.Promise.mapSeries(cssFilenames, (cssFilename) => {
-        return insertSingleCssFile(cssFilename, document, el, log);
-    });
-}
-/**
- * Injects custom style text or CSS file or 3rd party style resources
- * into the given document.
- */
-const injectStylesBeforeElement = (options, document, el) => {
-    if (!el)
-        return;
-    // first insert all stylesheets as Link elements
-    let stylesheets = [];
-    if (typeof options.stylesheet === 'string') {
-        stylesheets.push(options.stylesheet);
-    }
-    else if (Array.isArray(options.stylesheet)) {
-        stylesheets = stylesheets.concat(options.stylesheet);
-    }
-    if (typeof options.stylesheets === 'string') {
-        options.stylesheets = [options.stylesheets];
-    }
-    if (options.stylesheets) {
-        stylesheets = stylesheets.concat(options.stylesheets);
-    }
-    insertStylesheets(stylesheets, document, el);
-    // insert any styles as <style>...</style> elements
-    let styles = [];
-    if (typeof options.style === 'string') {
-        styles.push(options.style);
-    }
-    else if (Array.isArray(options.style)) {
-        styles = styles.concat(options.style);
-    }
-    if (typeof options.styles === 'string') {
-        styles.push(options.styles);
-    }
-    else if (Array.isArray(options.styles)) {
-        styles = styles.concat(options.styles);
-    }
-    insertStyles(styles, document, el);
-    // now load any css files by path and add their content
-    // as <style>...</style> elements
-    let cssFiles = [];
-    if (typeof options.cssFile === 'string') {
-        cssFiles.push(options.cssFile);
-    }
-    else if (Array.isArray(options.cssFile)) {
-        cssFiles = cssFiles.concat(options.cssFile);
-    }
-    if (typeof options.cssFiles === 'string') {
-        cssFiles.push(options.cssFiles);
-    }
-    else if (Array.isArray(options.cssFiles)) {
-        cssFiles = cssFiles.concat(options.cssFiles);
-    }
-    return insertLocalCssFiles(cssFiles, document, el, options.log);
-};
-function setupHooks(optionalCallback) {
-    // When running component specs, we cannot allow "cy.visit"
-    // because it will wipe out our preparation work, and does not make much sense
-    // thus we overwrite "cy.visit" to throw an error
-    Cypress.Commands.overwrite('visit', () => {
-        throw new Error('cy.visit from a component spec is not allowed');
-    });
-    // @ts-ignore
-    Cypress.on('test:before:run', () => {
-        optionalCallback === null || optionalCallback === void 0 ? void 0 : optionalCallback();
-        cleanupStyles();
-    });
+var scheduler = typeof setImmediate === 'function' ? setImmediate : setTimeout;
+// Credit to: https://github.com/kentor/flush-promises
+function flushPromises() {
+    return new Promise(function (resolve) {
+        scheduler(resolve, 0);
+    });
 }
 
+var _VueTestUtils = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    DOMWrapper: DOMWrapper,
+    RouterLinkStub: RouterLinkStub,
+    VueWrapper: VueWrapper,
+    config: config,
+    createWrapperError: createWrapperError,
+    disableAutoUnmount: disableAutoUnmount,
+    enableAutoUnmount: enableAutoUnmount,
+    flushPromises: flushPromises,
+    mount: mount$1,
+    shallowMount: shallowMount
+});
+
+var // We do not expose the `mount` from VueTestUtils, instead, we wrap it and expose a
+// Cypress-compatible `mount` API.
+VTUmount = mount$1, 
+VueTestUtils = __rest(_VueTestUtils, ["mount", "shallowMount"]);
 var DEFAULT_COMP_NAME = 'unknown';
 Cypress.on('run:start', function () {
     // `mount` is designed to work with component testing only.
@@ -13480,7 +13556,7 @@ function mount(componentOptions, options) {
         componentNode.id = '__cy_vue_root';
         el.append(componentNode);
         // mount the component using VTU and return the wrapper in Cypress.VueWrapper
-        var wrapper = mount$1(componentOptions, __assign$1({ attachTo: componentNode }, options));
+        var wrapper = VTUmount(componentOptions, __assign$1({ attachTo: componentNode }, options));
         Cypress.vueWrapper = wrapper;
         Cypress.vue = wrapper.vm;
         return cy
@@ -13529,7 +13605,16 @@ function mountCallback(component, options) {
         return mount(component, options);
     };
 }
+// Side effects from "import { mount } from '@cypress/<my-framework>'" are annoying, we should avoid doing this
+// by creating an explicit function/import that the user can register in their 'component.js' support file,
+// such as:
+//    import 'cypress/<my-framework>/support'
+// or
+//    import { registerCT } from 'cypress/<my-framework>'
+//    registerCT()
+// Note: This would be a breaking change
 setupHooks();
 
+exports.VueTestUtils = VueTestUtils;
 exports.mount = mount;
 exports.mountCallback = mountCallback;