feat #113 (quantity selector): add more unit tests

Orange-OpenSource · Dec 22, 2021 · 1129e73 · 1129e73
1 parent bbbeaf1
commit 1129e73
Showing 1 changed file with 31 additions and 6 deletions.
diff --git a/js/tests/unit/quantity-selector.spec.js b/js/tests/unit/quantity-selector.spec.js
@@ -1,8 +1,6 @@
 import QuantitySelector from '../../src/quantity-selector'
-import EventHandler from '../../src/dom/event-handler'
 import { clearFixture, getFixture } from '../helpers/fixture'
 
-
 describe('QuantitySelector', () => {
   let fixtureEl
 
@@ -38,8 +36,8 @@ describe('QuantitySelector', () => {
     })
   })
 
-  it('should take care of element either passed as a CSS selector or DOM element', () => {
-    fixtureEl.innerHTML = '<button data-bs-step="up">Placeholder</button>'
+  it('should take care of element either passed as a CSS selector or DOM element - Step Up button', () => {
+    fixtureEl.innerHTML = '<button data-bs-step="up"></button>'
     const buttonEl = fixtureEl.querySelector('[data-bs-step="up"]')
     const buttonBySelector = new QuantitySelector('[data-bs-step="up"]')
     const buttonByElement = new QuantitySelector(buttonEl)
@@ -48,8 +46,8 @@ describe('QuantitySelector', () => {
     expect(buttonByElement._element).toEqual(buttonEl)
   })
 
-  it('should take care of element either passed as a CSS selector or DOM element', () => {
-    fixtureEl.innerHTML = '<button data-bs-step="down">Placeholder</button>'
+  it('should take care of element either passed as a CSS selector or DOM element - Step Down button', () => {
+    fixtureEl.innerHTML = '<button data-bs-step="down"></button>'
     const buttonEl = fixtureEl.querySelector('[data-bs-step="down"]')
     const buttonBySelector = new QuantitySelector('[data-bs-step="down"]')
     const buttonByElement = new QuantitySelector(buttonEl)
@@ -58,4 +56,31 @@ describe('QuantitySelector', () => {
     expect(buttonByElement._element).toEqual(buttonEl)
   })
 
+  it('should increment by one step on click on StepUp button', () => {
+    fixtureEl.innerHTML = '<button data-bs-step="up"></button>'
+    const buttonEl = fixtureEl.querySelector('[data-bs-step="up"]')
+    fixtureEl.innerHTML = '<input data-bs-step="counter"></input>'
+    const inputEl = fixtureEl.querySelector('[data-bs-step="counter"]')
+    const counterStep = inputEl.getAttribute('step')
+    const counterMax = inputEl.getAttribute('max')
+    const counterValue = inputEl.value
+
+    buttonEl.click()
+
+    expect(inputEl.value === counterValue + counterStep || inputEl.value === counterMax)
+  })
+
+  it('should decrement by one step on click on StepDown button', () => {
+    fixtureEl.innerHTML = '<button data-bs-step="down"></button>'
+    const buttonEl = fixtureEl.querySelector('[data-bs-step="down"]')
+    fixtureEl.innerHTML = '<input data-bs-step="counter"></input>'
+    const inputEl = fixtureEl.querySelector('[data-bs-step="counter"]')
+    const counterStep = inputEl.getAttribute('step')
+    const counterMin = inputEl.getAttribute('min')
+    const counterValue = inputEl.value
+
+    buttonEl.click()
+
+    expect(inputEl.value === counterValue - counterStep || inputEl.value === counterMin)
+  })
 })