chore: update config files

Author: actions-user

src/add-click-event.js

@@ -1,2 +1,5 @@
 export default (diagram, options = {}) =>
-  diagram.replace(/^(\s*click\s+[^\s]+\s*)$/gm, `$1 mermaidClick_${options.id}`)
+  diagram.replace(
+    /^(\s*click\s+[^\s]+\s*)$/gm,
+    `$1 mermaidClick_${options.id}`,
+  );

src/add-click-event.spec.js

@@ -1,7 +1,7 @@
-import { endent } from '@dword-design/functions'
-import tester from '@dword-design/tester'
+import { endent } from '@dword-design/functions';
+import tester from '@dword-design/tester';
 
-import self from './add-click-event.js'
+import self from './add-click-event.js';
 
 export default tester(
   {
@@ -32,4 +32,4 @@ export default tester(
         expect(self(test.subject, { id: '<id>' })).toEqual(test.result),
     },
   ],
-)
+);

src/index.spec.js

@@ -1,11 +1,11 @@
-import { endent, filter } from '@dword-design/functions'
-import tester from '@dword-design/tester'
-import testerPluginComponent from '@dword-design/tester-plugin-component'
-import { expect } from '@playwright/test'
-import { createRequire } from 'module'
-import { chromium } from 'playwright'
+import { endent, filter } from '@dword-design/functions';
+import tester from '@dword-design/tester';
+import testerPluginComponent from '@dword-design/tester-plugin-component';
+import { expect } from '@playwright/test';
+import { createRequire } from 'module';
+import { chromium } from 'playwright';
 
-const resolver = createRequire(import.meta.url)
+const resolver = createRequire(import.meta.url);
 
 export default tester(
   {
@@ -41,12 +41,13 @@ export default tester(
         </script>
       `,
       async test() {
-        await this.page.goto('http://localhost:3000')
-        await this.page.waitForSelector('.foo svg')
-        await this.page.click('button')
+        await this.page.goto('http://localhost:3000');
+        await this.page.waitForSelector('.foo svg');
+        await this.page.click('button');
+
         expect(await this.page.screenshot('.foo svg')).toMatchImageSnapshot(
           this,
-        )
+        );
       },
     },
     click: {
@@ -90,28 +91,32 @@ export default tester(
         </script>
       `,
       async test() {
-        const callbackPrefix = 'mermaidClick_'
-        await this.page.goto('http://localhost:3000')
+        const callbackPrefix = 'mermaidClick_';
+        await this.page.goto('http://localhost:3000');
+
         await this.page.waitForSelector(
           '.diagram a[*|href="https://google.com"] .node[id^=flowchart-A-]',
-        )
+        );
+
         expect(
           (
             this.page.evaluate(() => Object.keys(window))
             |> await
             |> filter(key => key.startsWith(callbackPrefix))
           ).length,
-        ).toEqual(1)
-        await this.page.click('.diagram .node[id^=flowchart-B-]')
-        await this.page.waitForSelector('.diagram.clicked')
-        await this.page.click('.hide-button')
+        ).toEqual(1);
+
+        await this.page.click('.diagram .node[id^=flowchart-B-]');
+        await this.page.waitForSelector('.diagram.clicked');
+        await this.page.click('.hide-button');
+
         expect(
           (
             this.page.evaluate(() => Object.keys(window))
             |> await
             |> filter(key => key.startsWith(callbackPrefix))
           ).length,
-        ).toEqual(0)
+        ).toEqual(0);
       },
     },
     /* 'click: multiple diagrams': {
@@ -206,10 +211,11 @@ export default tester(
         </script>
       `,
       async test() {
-        await this.page.goto('http://localhost:3000')
+        await this.page.goto('http://localhost:3000');
+
         await expect(this.page.locator('.foo')).toHaveText(
           'UnknownDiagramError: No diagram type detected matching given configuration for text: foo',
-        )
+        );
       },
     },
     options: {
@@ -233,10 +239,11 @@ export default tester(
         </script>
       `,
       async test() {
-        await this.page.goto('http://localhost:3000')
+        await this.page.goto('http://localhost:3000');
+
         expect(
           await this.page.locator('.foo svg').screenshot(),
-        ).toMatchImageSnapshot(this)
+        ).toMatchImageSnapshot(this);
       },
     },
     works: {
@@ -260,23 +267,24 @@ export default tester(
         </script>
       `,
       async test() {
-        await this.page.goto('http://localhost:3000')
+        await this.page.goto('http://localhost:3000');
+
         expect(
           await this.page.locator('.foo svg').screenshot(),
-        ).toMatchImageSnapshot(this)
+        ).toMatchImageSnapshot(this);
       },
     },
   },
   [
     testerPluginComponent({ componentPath: resolver.resolve('./index.vue') }),
     {
       async after() {
-        await this.browser.close()
+        await this.browser.close();
       },
       async before() {
-        this.browser = await chromium.launch()
-        this.page = await this.browser.newPage()
+        this.browser = await chromium.launch();
+        this.page = await this.browser.newPage();
       },
     },
   ],
-)
+);

src/index.vue

@@ -3,39 +3,42 @@
 </template>
 
 <script>
-import mermaid from 'mermaid'
-import { nanoid } from 'nanoid'
+import mermaid from 'mermaid';
+import { nanoid } from 'nanoid';
 
-import addClickEvent from './add-click-event.js'
+import addClickEvent from './add-click-event.js';
 
 export default {
   beforeUnmount() {
     if (typeof window === 'undefined') {
-      return
+      return;
     }
-    delete window[`mermaidClick_${this.id}`]
+
+    delete window[`mermaidClick_${this.id}`];
   },
   computed: {
     allData() {
-      return [this.finalValue, this.id]
+      return [this.finalValue, this.id];
     },
     finalValue() {
-      return addClickEvent(this.value, { id: this.id })
+      return addClickEvent(this.value, { id: this.id });
     },
   },
   data: () => ({ id: undefined }),
   emits: ['node-click', 'parse-error', 'rendered'],
   mounted() {
     if (typeof window === 'undefined') {
-      return
+      return;
     }
+
     mermaid.initialize({
       securityLevel: 'loose',
       startOnLoad: false,
       theme: 'default',
       ...this.options,
-    })
-    this.id = nanoid()
+    });
+
+    this.id = nanoid();
   },
   name: 'VueMermaidString',
   props: {
@@ -47,39 +50,46 @@ export default {
       flush: 'post',
       async handler() {
         if (typeof window === 'undefined') {
-          return
+          return;
         }
+
         if (!this.finalValue) {
-          return
+          return;
         }
+
         if (!this.id) {
-          return
+          return;
         }
-        this.$el.removeAttribute('data-processed')
-        mermaid.parseError = error => this.$emit('parse-error', error)
+
+        this.$el.removeAttribute('data-processed');
+        mermaid.parseError = error => this.$emit('parse-error', error);
+
         await mermaid.run({
           nodes: [this.$el],
           postRenderCallback: () => this.$emit('rendered'),
-        })
+        });
       },
       immediate: true,
     },
     id: {
       handler(id, previousId) {
         if (typeof window === 'undefined') {
-          return
+          return;
         }
+
         if (previousId) {
-          delete window[`mermaidClick_${previousId}`]
+          delete window[`mermaidClick_${previousId}`];
         }
+
         if (!this.id) {
-          return
+          return;
         }
+
         window[`mermaidClick_${this.id}`] = nodeId =>
-          this.$emit('node-click', nodeId)
+          this.$emit('node-click', nodeId);
       },
       immediate: true,
     },
   },
-}
+};
 </script>