@forsakringskassan/cypress-config 1.8.0 → 1.9.0

package/README.md

@@ -54,7 +54,7 @@ A configuration function is available for usage in `cypress/support/e2e.ts` and/
 ```ts
 import { configure } from "@forsakringskassan/cypress-config/support";
 
-configure({
+await configure({
     resetEmulatedMedia: true,
     afterEach: {
         htmlvalidate: true,
@@ -97,6 +97,16 @@ Cypress.Commands.add("mount", (component, options = {}) => {
 });
 ```
 
+For advanced usage, use the `createMount()` call to create the `mount()` function manually:
+
+```ts
+import { createMount } from "@forsakringskassan/cypress-config/support";
+
+const mount = await createMount({/* options */});
+
+Cypress.Commands.add("mount", mount);
+```
+
 ### Commands
 
 This preset adds new custom commands:
@@ -209,7 +219,7 @@ To automatically run validation after each test configure it using the configura
 ```ts
 import { configure } from "@forsakringskassan/cypress-config/support";
 
-configure({
+await configure({
     resetEmulatedMedia: true,
     afterEach: {
         htmlvalidate: true,

package/dist/support.d.ts

@@ -1,3 +1,4 @@
+import type * as FkuiVue from '@fkui/vue';
 import { mount as mount_2 } from 'cypress/vue';
 
 /**
@@ -7,20 +8,59 @@ import { mount as mount_2 } from 'cypress/vue';
  * @since v1.1.0
  */
 export declare function configure(options: {
+    fkuiVue?: typeof FkuiVue;
     /** When enabled, any emulated CSS media features will be reset between runs */
     resetEmulatedMedia: boolean;
     afterEach: {
         htmlvalidate: boolean;
     };
-}): void;
+}): Promise<void>;
+
+/**
+ * Create a wrapper around `mount()` from `cypress/vue` with new defaults.
+ *
+ * @example
+ *
+ * ```ts
+ * import { createMount } from "@forsakringskassan/cypress-config/support";
+ *
+ * const mount = await createMount();
+ *
+ * Cypress.Commands.add("mount", mount);
+ * ```
+ *
+ * @remarks When passing in a custom `fkuiVue` module a default static copy will
+ * still be imported (but largely unused), this is due to how Cypress bundles
+ * the files (including dynamic imports). Any global side-effects will run for
+ * both!
+ *
+ * @public
+ * @since v1.9.0
+ */
+export declare function createMount(options?: {
+    fkuiVue?: typeof FkuiVue;
+}): Promise<MountFn>;
 
 /**
  * Wrapper around `mount()` from `cypress/vue` with new defaults.
  *
+ * If you need to customize the `mount()` behaviour use `createMount()`.
+ *
+ * @example
+ *
+ * ```ts
+ * import { mount } from "@forsakringskassan/cypress-config/support";
+ *
+ * Cypress.Commands.add("mount", mount);
+ * ```
+ *
  * @public
  * @since v1.7.0
  */
-export declare const mount: (component: Parameters<typeof mount_2>[0], options?: NonNullable<Parameters<typeof mount_2>[1]>) => ReturnType<typeof mount_2>;
+export declare const mount: MountFn;
+
+/** @public */
+export declare type MountFn = (component: Parameters<typeof mount_2>[0], options?: NonNullable<Parameters<typeof mount_2>[1]>) => ReturnType<typeof mount_2>;
 
 export { }
 

package/dist/support.mjs

@@ -68,7 +68,6 @@ Cypress.Commands.add("prefersColorScheme", (value) => {
 });
 
 // src/support/configure.ts
-import { config } from "@fkui/vue";
 function resetEmulatedMedia(emulatedMedia3) {
   if (!emulatedMedia3.isEnabled()) {
     return;
@@ -79,7 +78,8 @@ function resetEmulatedMedia(emulatedMedia3) {
     log: false
   });
 }
-function configure(options) {
+async function configure(options) {
+  const { config } = options.fkuiVue ?? await import("@fkui/vue");
   if (Cypress.testingType === "component") {
     config.teleportTarget = "#teleport";
   }
@@ -101,34 +101,39 @@ function configure(options) {
 
 // src/support/mount.ts
 import { mount as originalMount } from "cypress/vue";
-import {
-  FormatPlugin,
-  TestPlugin,
-  TranslationPlugin,
-  ValidationPlugin,
-  setRunningContext
-} from "@fkui/vue";
-var mount = (component, options) => {
-  options ??= {};
-  options.global ??= {};
-  options.global.plugins ??= [];
-  options.global.config ??= {};
-  options.global.config.compilerOptions ??= {};
-  options.global.config.compilerOptions.whitespace = "preserve";
-  options.global.plugins.push(
+async function createMount(options) {
+  const {
+    FormatPlugin,
+    TestPlugin,
+    TranslationPlugin,
+    ValidationPlugin,
+    setRunningContext
+  } = options?.fkuiVue ?? await import("@fkui/vue");
+  const plugins = [
     FormatPlugin,
     TestPlugin,
     TranslationPlugin,
     ValidationPlugin
-  );
-  options.global.plugins.push({
-    install(app) {
-      setRunningContext(app);
-    }
-  });
-  return originalMount(component, options);
-};
+  ];
+  return (component, options2) => {
+    options2 ??= {};
+    options2.global ??= {};
+    options2.global.plugins ??= [];
+    options2.global.config ??= {};
+    options2.global.config.compilerOptions ??= {};
+    options2.global.config.compilerOptions.whitespace = "preserve";
+    options2.global.plugins.push(...plugins);
+    options2.global.plugins.push({
+      install(app) {
+        setRunningContext(app);
+      }
+    });
+    return originalMount(component, options2);
+  };
+}
+var mount = await createMount();
 export {
   configure,
+  createMount,
   mount
 };

package/dist/tsdoc-metadata.json

@@ -5,7 +5,7 @@
   "toolPackages": [
     {
       "packageName": "@microsoft/api-extractor",
-      "packageVersion": "7.59.0"
+      "packageVersion": "7.59.1"
     }
   ]
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@forsakringskassan/cypress-config",
-  "version": "1.8.0",
+  "version": "1.9.0",
   "description": "Sharable Cypress configuration building blocks for Försäkringskassan",
   "keywords": [
     "cypress"
@@ -43,7 +43,7 @@
   "dependencies": {
     "@forsakringskassan/cypress-axe": "5.1.5",
     "cypress-html-validate": "9.1.0",
-    "mocha-multi-reporters": "1.5.1"
+    "mocha-multi-reporters": "1.5.2"
   },
   "peerDependencies": {
     "@fkui/vue": ">= 6.0.0",