refactor(refs T29004): re-add label tests

CHANGELOG.md

@@ -4,6 +4,9 @@ Since v0.0.10, this Changelog is formatted according to the [Common Changelog][c
 
 ## UNRELEASED
 
+### Added
+- ([#591](https://github.com/demos-europe/demosplan-ui/pull/591)) Add label tests for form components ([@hwiem](https://github.com/hwiem))
+
 ## v0.2.1 - 2023-10-18
 
 ### Changed

tests/form/DpCheckbox.spec.js

@@ -10,6 +10,8 @@ describe('DpCheckbox', () => {
     }
   })
 
+  runLabelTests(wrapper)
+
   const checkbox = wrapper.find('input[type="checkbox"]')
   runBooleanAttrTests(wrapper, checkbox, 'required')
   runBooleanAttrTests(wrapper, checkbox, 'disabled')

tests/form/DpInput.spec.js

@@ -1,23 +1,24 @@
 import { runBooleanAttrTests, runStringAttrTests } from './shared/Attributes'
+import { runLabelTests } from './shared/Label'
 import DpInput from '~/components/DpInput'
 import { shallowMount } from '@vue/test-utils'
 
 describe('DpInput', () => {
-  // const wrapper = shallowMount(DpInput, {
-  //   propsData: {
-  //     id: 'inputId'
-  //   }
-  // })
-  // RunLabelTests(wrapper)
+  const wrapper = shallowMount(DpInput, {
+    propsData: {
+      id: 'inputId'
+    }
+  })
+  runLabelTests(wrapper)
 
-  // const input = wrapper.find('input[type="text"]')
-  // runBooleanAttrTests(wrapper, input, 'required')
-  // runBooleanAttrTests(wrapper, input, 'disabled')
-  // runBooleanAttrTests(wrapper, input, 'readonly')
-  // runStringAttrTests(wrapper, input, 'placeholder', 'This is a placeholder.', 'data-dp-validate-error')
-  // runStringAttrTests(wrapper, input, 'dataDpValidateError', 'Bitte füllen Sie alle Pflichtfelder(*) korrekt aus.', 'data-dp-validate-error')
-  // runStringAttrTests(wrapper, input, 'dataDpValidateIf', '#r_getEvaluation', 'data-dp-validate-if')
-  // runStringAttrTests(wrapper, input, 'dataDpValidateShouldEqual', 'This is a placeholder.', 'data-dp-validate-should-equal')
+  const input = wrapper.find('input[type="text"]')
+  runBooleanAttrTests(wrapper, input, 'required')
+  runBooleanAttrTests(wrapper, input, 'disabled')
+  runBooleanAttrTests(wrapper, input, 'readonly')
+  runStringAttrTests(wrapper, input, 'placeholder', 'This is a placeholder.', 'placeholder')
+  runStringAttrTests(wrapper, input, 'dataDpValidateError', 'Bitte füllen Sie alle Pflichtfelder(*) korrekt aus.', 'data-dp-validate-error')
+  runStringAttrTests(wrapper, input, 'dataDpValidateIf', '#r_getEvaluation', 'data-dp-validate-if')
+  runStringAttrTests(wrapper, input, 'dataDpValidateShouldEqual', 'This is a placeholder.', 'data-dp-validate-should-equal')
 
   it('emits an event on input with the new value as argument', async () => {
     const newValue = 'some text'
@@ -32,15 +33,15 @@ describe('DpInput', () => {
     expect(componentWrapper.emitted().input[0][0]).toEqual(newValue)
   })
 
-  // it('emits an event on keydown enter', () => {
-  //   const componentWrapper = shallowMount(DpInput, {
-  //     propsData: {
-  //       id: 'inputId'
-  //     }
-  //   })
-  //
-  //   const input = componentWrapper.find('input')
-  //   input.trigger('keydown.enter')
-  //   expect(componentWrapper.emitted().enter).toBeDefined()
-  // })
+  it('emits an event on keydown enter', () => {
+    const componentWrapper = shallowMount(DpInput, {
+      propsData: {
+        id: 'inputId'
+      }
+    })
+
+    const input = componentWrapper.find('input')
+    input.trigger('keydown.enter')
+    expect(componentWrapper.emitted().enter).toBeDefined()
+  })
 })

tests/form/DpSelect.spec.js

@@ -1,6 +1,7 @@
 import DpSelect from '~/components/DpSelect'
 import { de } from '~/components/shared/translations'
 import { runBooleanAttrTests } from './shared/Attributes'
+import { runLabelTests } from './shared/Label'
 import shallowMountWithGlobalMocks from '../../jest/shallowMountWithGlobalMocks'
 
 
@@ -18,7 +19,7 @@ describe('DpSelect', () => {
   const wrapper = shallowMountWithGlobalMocks(DpSelect, {
     propsData: { options }
   })
-  // RunLabelTests(wrapper)
+  runLabelTests(wrapper)
 
   const select = wrapper.find('select')
   runBooleanAttrTests(wrapper, select, 'disabled')

tests/form/shared/Label.js

@@ -1,14 +1,18 @@
 const runLabelTests = (wrapper) => describe('ComponentWithLabel', () => {
   it('displays a label if label is defined', async () => {
-    const label = 'someLabel'
+    const label  = {
+      text: 'someLabel'
+    }
     await wrapper.setProps({ label: label })
     const labelStub = wrapper.find('dp-label-stub')
     expect(labelStub.exists()).toBe(true)
-    expect(labelStub.attributes('text')).toBe(label)
+    expect(labelStub.attributes('text')).toBe(label.text)
   })
 
   it('does not display a label if label is not defined', async () => {
-    const label = ''
+    const label = {
+      text: ''
+    }
     await wrapper.setProps({ label: label })
 
     const labelStub = wrapper.find('dp-label-stub')