@worksafevictoria/wcl7.5 1.1.0-beta.9 → 1.1.0-beta.90

package/src/components/SubComponents/FormInstance/tests/token.test.js

@@ -0,0 +1,33 @@
+import { TwigFormElement } from '../models/overrides/twig'
+import json from '../stories/mocks/token.json'
+import { FormTestUtils } from './form-test-utils'
+
+const testComponent = 'token'
+describe(`Form ${testComponent} parser`, () => {
+  it(`should render a ${testComponent} component`, () => {
+    const components = FormTestUtils.getParsedComponentsFromJSON(json)
+    const form = { components }
+    const data = {
+      full_name: 'sds',
+      checkbox1: true,
+      container: {
+        container_textbox: 'afssf',
+        tx1: [
+          {
+            tx1: 'dsfs'
+          }
+        ]
+      }
+    }
+    const twig = new TwigFormElement()
+    const printFn = twig.printTokens.toString()
+    const printFnBody = printFn.slice(
+      printFn.indexOf('{') + 1,
+      printFn.lastIndexOf(';')
+    )
+
+    expect(eval(printFnBody)).toBe(
+      `first name: sds<br/>is coming?: Yes<br/>Where do you live?: afssf<br/>Child: dsfs`
+    )
+  })
+})

package/src/components/SubComponents/FormInstance/tests/twig.test.js

@@ -0,0 +1,74 @@
+import json from '../stories/mocks/twig.json'
+import { FormTestUtils } from './form-test-utils'
+
+const testComponent = 'twig'
+describe(`Form ${testComponent} parser`, () => {
+  it(`should render a ${testComponent} component`, () => {
+    const components = FormTestUtils.getParsedComponentsFromJSON(json)
+    expect(components).toEqual(
+      FormTestUtils.getComparisonJSON([
+        {
+          attributes: { counter: 1 },
+          clearOnHide: true,
+          customClass: 'custom-formio-1',
+          decimalLimit: 0,
+          defaultValue: 2,
+          delimiter: true,
+          disabled: false,
+          hideLabel: false,
+          id: 'kitchen_sink_formio_v1--n1',
+          input: true,
+          inputFormat: 'plain',
+          key: 'n1',
+          label: 'n1',
+          labelPosition: 'top',
+          mask: false,
+          requireDecimal: false,
+          truncateMultipleSpaces: true,
+          type: 'number',
+          validate: { required: false }
+        },
+        {
+          attributes: { counter: 2 },
+          clearOnHide: true,
+          customClass: 'custom-formio-2',
+          decimalLimit: 0,
+          defaultValue: 3,
+          delimiter: true,
+          disabled: false,
+          hideLabel: false,
+          id: 'kitchen_sink_formio_v1--n2',
+          input: true,
+          inputFormat: 'plain',
+          key: 'n2',
+          label: 'n2',
+          labelPosition: 'top',
+          mask: false,
+          requireDecimal: false,
+          truncateMultipleSpaces: true,
+          type: 'number',
+          validate: { required: false }
+        },
+        {
+          attributes: { counter: 3 },
+          clearOnHide: true,
+          content:
+            '<label for="0" class="col-form-label">Twig with template {{( data.n2 + data.n1 )}}</label><div id="0">the sum of two numbers is {{( data.n2 + data.n1 )}}</div>',
+          customClass: 'custom-formio-3',
+          disabled: false,
+          hideLabel: false,
+          id: 'kitchen_sink_formio_v1--twig1',
+          input: false,
+          key: 'twig1',
+          label: 'Twig with template {{( data.n2 + data.n1 )}}',
+          labelPosition: 'top',
+          mask: false,
+          refreshOnChange: true,
+          tag: 'div',
+          type: 'htmlelement',
+          validate: { required: false }
+        }
+      ])
+    )
+  })
+})

package/src/components/SubComponents/FormInstance/tests/url.test.js

@@ -0,0 +1,48 @@
+import json from '../stories/mocks/url.json'
+import { FormTestUtils } from './form-test-utils'
+
+const testComponent = 'url'
+describe(`Form ${testComponent} parser`, () => {
+  it(`should render a ${testComponent} component`, () => {
+    const components = FormTestUtils.getParsedComponentsFromJSON(json)
+    expect(components).toEqual(
+      FormTestUtils.getComparisonJSON([
+        {
+          attributes: { counter: 1 },
+          clearOnHide: true,
+          customClass: 'custom-formio-1',
+          disabled: false,
+          hideLabel: false,
+          id: 'kitchen_sink_formio_v1--url1',
+          input: true,
+          key: 'url1',
+          label: 'url1',
+          labelPosition: 'top',
+          mask: false,
+          type: 'url',
+          validate: { maxLength: 255, required: false },
+        },
+      ]),
+    )
+  })
+
+  it(`should return a submission value with prefix`, async () => {
+    const submission = await FormTestUtils.handleSubmission(
+      json,
+      'https://www.google.com',
+    )
+    expect(submission).toEqual({
+      url1: 'https://www.google.com',
+    })
+  })
+
+  it(`should return a submission value without prefix`, async () => {
+    const submission = await FormTestUtils.handleSubmission(
+      json,
+      'www.google.com',
+    )
+    expect(submission).toEqual({
+      url1: 'http://www.google.com',
+    })
+  })
+})

package/src/components/SubComponents/FormInstance/tests/value.test.js

@@ -0,0 +1,31 @@
+import json from '../stories/mocks/value.json'
+import { FormTestUtils } from './form-test-utils'
+
+const testComponent = 'value'
+describe(`Form ${testComponent} parser`, () => {
+  it(`should render a ${testComponent} component`, () => {
+    const components = FormTestUtils.getParsedComponentsFromJSON(json)
+    expect(components).toEqual(
+      FormTestUtils.getComparisonJSON([
+        {
+          attributes: { counter: 1 },
+          clearOnHide: true,
+          customClass: 'custom-formio-1',
+          defaultValue: '<h1>Heading h1</h1> <p>test</p>',
+          disabled: false,
+          editor: 'quill',
+          hideLabel: false,
+          id: 'kitchen_sink_formio_v1--value1',
+          input: true,
+          isUploadEnabled: false,
+          key: 'value1',
+          label: 'value1',
+          labelPosition: 'top',
+          mask: false,
+          type: 'textarea',
+          validate: { required: false }
+        }
+      ])
+    )
+  })
+})

package/src/components/SubComponents/FormInstance/tests/wizard.test.js

@@ -0,0 +1,145 @@
+import json from '../stories/mocks/wizard.json'
+import { FormTestUtils } from './form-test-utils'
+
+const testComponent = 'wizard'
+describe(`Form ${testComponent} parser`, () => {
+  it(`should render a ${testComponent} component`, () => {
+    const components = FormTestUtils.getParsedComponentsFromJSON(json)
+    expect(components).toEqual(
+      FormTestUtils.getComparisonJSON([
+        {
+          attributes: { counter: 1 },
+          clearOnHide: true,
+          collapsed: true,
+          collapsible: true,
+          components: [
+            {
+              attributes: { counter: 4 },
+              clearOnHide: true,
+              customClass: 'custom-formio-4',
+              disabled: false,
+              hideLabel: false,
+              id: 'kitchen_sink_formio_v1--t1e',
+              input: true,
+              key: 't1e',
+              label: 'label 1',
+              labelPosition: 'top',
+              mask: false,
+              type: 'textfield',
+              validate: { maxLength: 255, required: true }
+            },
+            {
+              attributes: { counter: 5 },
+              clearOnHide: true,
+              customClass: 'custom-formio-5',
+              disabled: false,
+              hideLabel: false,
+              id: 'kitchen_sink_formio_v1--t1d',
+              input: true,
+              key: 't1d',
+              label: 'label 2',
+              labelPosition: 'top',
+              mask: false,
+              type: 'textfield',
+              validate: { maxLength: 255, required: true }
+            },
+            {
+              attributes: { counter: 6 },
+              clearOnHide: true,
+              customClass: 'custom-formio-6',
+              disabled: false,
+              hideLabel: false,
+              id: 'kitchen_sink_formio_v1--t1c',
+              input: true,
+              key: 't1c',
+              label: 'label 3',
+              labelPosition: 'top',
+              mask: false,
+              type: 'textfield',
+              validate: { maxLength: 255, required: true }
+            },
+            {
+              attributes: { counter: 7 },
+              clearOnHide: true,
+              customClass: 'custom-formio-7',
+              disabled: false,
+              hideLabel: false,
+              id: 'kitchen_sink_formio_v1--t1b',
+              input: true,
+              key: 't1b',
+              label: 'label 4',
+              labelPosition: 'top',
+              mask: false,
+              type: 'textfield',
+              validate: { maxLength: 255, required: true }
+            },
+            {
+              attributes: { counter: 8 },
+              clearOnHide: true,
+              customClass: 'custom-formio-8',
+              disabled: false,
+              hideLabel: false,
+              id: 'kitchen_sink_formio_v1--t1a',
+              input: true,
+              key: 't1a',
+              label: 'label 5',
+              labelPosition: 'top',
+              mask: false,
+              type: 'textfield',
+              validate: { maxLength: 255, required: true }
+            }
+          ],
+          customClass: 'custom-formio-1',
+          description: '',
+          disabled: false,
+          hideLabel: false,
+          id: 'kitchen_sink_formio_v1--p1',
+          input: false,
+          key: 'p1',
+          label: 'p1',
+          labelPosition: 'top',
+          mask: false,
+          title: 'p1',
+          type: 'panel',
+          validate: {}
+        },
+        {
+          attributes: { counter: 2 },
+          clearOnHide: true,
+          collapsed: true,
+          collapsible: true,
+          components: [
+            {
+              attributes: { counter: 9 },
+              clearOnHide: true,
+              customClass: 'custom-formio-9',
+              disabled: false,
+              hideLabel: false,
+              id: 'kitchen_sink_formio_v1--t2',
+              input: true,
+              key: 't2',
+              label: 't2',
+              labelPosition: 'top',
+              mask: false,
+              type: 'textfield',
+              validate: { maxLength: 255, required: false }
+            }
+          ],
+          customClass: 'custom-formio-2',
+          description: '',
+          disabled: false,
+          hideLabel: false,
+          id: 'kitchen_sink_formio_v1--p2',
+          input: false,
+          key: 'p2',
+          label: 'p2',
+          labelPosition: 'top',
+          mask: false,
+          title: 'p2',
+          type: 'panel',
+          validate: {}
+        }
+      ])
+    )
+  })
+})

package/src/components/SubComponents/Icon/index.stories.js

@@ -5,10 +5,8 @@ import svg from '../../../assets/icons/instagram.svg?raw'
 export default {
   title: 'SubComponents/Icon',
   components: Icon,
+  tags: ['autodocs'],
   argTypes: {
-    bordered: {
-      control: 'boolean'
-    },
     glyph: {
       control: ['object', 'text'],
        table: { disable: true }
@@ -17,9 +15,6 @@ export default {
       control: ['number', 'text'],
       table: { disable: true }
     },
-    inverted: {
-      control: 'boolean'
-    },
     width: {
       control: ['number', 'text'],
       table: { disable: true }

package/src/components/SubComponents/MediaPlayer/index.stories.js

@@ -11,16 +11,11 @@ const mockData = {
 export default {
   title: 'SubComponents/MediaPlayer',
   component: { VideoPlayer, Container, Row, Column },
+  tags: ['autodocs'],
   argTypes: {
-    videoId: {
-      control: 'text',
-    },
     provider: {
       control: 'select',
       options: mockData.provider
-    },
-    rtl: {
-      control: 'boolean'
     }
   }
 }

package/src/components/SubComponents/Pagination/index.stories.js

@@ -3,6 +3,7 @@ import Pagination from './index.vue'
 export default {
   title: 'SubComponents/Pagination',
   component: Pagination,
+  tags: ['autodocs'],
   argTypes: {
     ariaLabel: {
       control: 'text',
@@ -10,9 +11,6 @@ export default {
         disable: true
       }
     },
-    rows: {
-      control: 'number',
-    },
     offset: {
       control: 'number',
       table: {
@@ -31,9 +29,6 @@ export default {
         disable: true
       }
     },
-    maxPages: {
-      control: 'number',
-    },
     pageClicked: { 
       table: { disable: true }
     },
@@ -93,8 +88,8 @@ const DefaultPagination = (args) => ({
     <h4>Sample Table data</h4>
     <table id="no-more-tables" class="table-bordered border">
       <tr v-for="(row, index) in items.slice(((cPage-1)*args.rows), ((cPage)*args.rows))" :key="index">
-        <td data-title="Name">{{row.name}}</td>
-        <td data-title="ID">{{row.id}}</td>
+        <td style="border-width: 1px" data-title="Name">{{row.name}}</td>
+        <td style="border-width: 1px" data-title="ID">{{row.id}}</td>
       </tr>
     </table>
     <br/>

package/src/components/SubComponents/ResourceGroup/List/index.stories.js

@@ -5,6 +5,7 @@ const bundleContent = ['Document', 'Presentation', 'Spreadsheet', 'Resource']
 export default {
   title: 'SubComponents/ResourceGroup',
   component: { ResourceGroup },
+  tags: ['autodocs'],
   argTypes: {
     background: {
       control: 'select',
@@ -32,7 +33,7 @@ export default {
     },
     resourceType: {
       control: 'text',
-     table: { disable: true }
+      table: { disable: true }
     }
   },
   args: {
@@ -50,7 +51,7 @@ export default {
     hasPreselectedFilters: false,
     totalResults: 10,
     filterResults: 1,
-    showLoadMore: false,
+    showLoadMore: true,
     resourceType: 'resource-list'
   }
 }