test(component-library): simplify stories of mt-password-field

shopware · Jan 29, 2025 · a7ca67f · a7ca67f
1 parent 52ff7b8
commit a7ca67f
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 80 deletions.
diff --git a/...nt-library/src/components/form/mt-password-field/mt-password-field.interactive.stories.ts b/...nt-library/src/components/form/mt-password-field/mt-password-field.interactive.stories.ts
@@ -10,8 +10,6 @@ export default {
   title: "Interaction Tests/Form/mt-password-field",
 } as MtPasswordFieldMeta;
 
-const password = "S3cr3tfor3$t";
-
 export const VisualTestLabel: MtPasswordFieldStory = {
   name: "Should display label",
   args: {
@@ -51,14 +49,15 @@ export const VisualTestDisabled: MtPasswordFieldStory = {
   name: "Should disable",
   args: {
     disabled: true,
-    modelValue: password,
+    modelValue: "S3cr3tfor3$t",
   },
 };
 
 export const VisualTestError: MtPasswordFieldStory = {
   name: "Should display error",
   args: {
     error: {
+      code: 500,
       detail: "Error while saving!",
     },
   },
@@ -67,7 +66,7 @@ export const VisualTestError: MtPasswordFieldStory = {
 export const VisualTestShowPassword: MtPasswordFieldStory = {
   name: "Should show password",
   args: {
-    modelValue: password,
+    modelValue: "S3cr3tfor3$t",
   },
   play: async ({ canvasElement }) => {
     const canvas = within(canvasElement);

diff --git a/...ages/component-library/src/components/form/mt-password-field/mt-password-field.stories.ts b/...ages/component-library/src/components/form/mt-password-field/mt-password-field.stories.ts
@@ -1,4 +1,3 @@
-import { action } from "@storybook/addon-actions";
 import MtPasswordField from "./mt-password-field.vue";
 import baseFieldArgTypes from "../_internal/mt-base-field/arg-types";
 import type { StoryObj } from "@storybook/vue3";
@@ -7,88 +6,16 @@ import { fn } from "@storybook/test";
 
 export type MtPasswordFieldMeta = SlottedMeta<
   typeof MtPasswordField,
-  | "default"
-  | "inheritanceRemove"
-  | "inheritanceRestore"
-  | "isInherited"
-  | "value"
-  | "hint"
-  | "suffix"
-  | "prefix"
-  | "error"
+  "default" | "hint" | "suffix" | "prefix"
 >;
 
 export default {
   title: "Components/Form/mt-password-field",
   component: MtPasswordField,
-  render: (args) => ({
-    template: `
-      <div>
-        <mt-password-field
-          v-bind="args"
-          :modelValue="currentValue"
-          @change="onChange"
-          @inheritance-restore="inheritanceRestoreWrapper"
-          @inheritance-remove="inheritanceRemoveWrapper"
-        >
-          <template
-              v-if="args.prefix"
-              #prefix>
-            {{ args.prefix }}
-          </template>
-          <template
-              v-if="args.suffix"
-              #suffix>
-            {{ args.suffix }}
-          </template>
-          <template
-              v-if="args.hint"
-              #hint>
-            {{ args.hint }}
-          </template>
-        </mt-password-field>
-        <h4 style="display: none;">hidden</h4>
-      </div>`,
-    components: { MtPasswordField },
-    data() {
-      return { currentValue: "" };
-    },
-    watch: {
-      "args.modelValue"(v) {
-        if (this.currentValue === v) {
-          return;
-        }
-
-        this.currentValue = v;
-      },
-    },
-    created() {
-      this.currentValue = args.modelValue;
-    },
-    methods: {
-      onChange(value: string) {
-        this.currentValue = value;
-      },
-      inheritanceRemoveWrapper(a: any) {
-        this.inheritanceRemove(...a);
-        args.isInherited = false;
-      },
-
-      inheritanceRestoreWrapper(a: any) {
-        this.inheritanceRestore(...a);
-        args.isInherited = true;
-      },
-    },
-    setup: () => {
-      return {
-        args,
-      };
-    },
-  }),
   args: {
     label: "Passwordfield",
-    change: fn(action("change")),
-    "onUpdate:modelValue": fn(action("updateModelValue")),
+    onChange: fn(),
+    "onUpdate:modelValue": fn(),
   },
   argTypes: {
     ...baseFieldArgTypes,