Merge pull request #946 from drewlee/master

Fixes maxlength conditional check for textarea & constrained input types

Author: rwjblue

addon-test-support/@ember/test-helpers/dom/-guard-for-maxlength.ts

@@ -13,8 +13,8 @@ function isMaxLengthConstrained(
 ): element is HTMLInputElement | HTMLTextAreaElement {
   return (
     !!Number(element.getAttribute('maxLength')) &&
-    (element instanceof HTMLInputElement ||
-      (element instanceof HTMLTextAreaElement && constrainedInputTypes.indexOf(element.type) > -1))
+    (element instanceof HTMLTextAreaElement ||
+      (element instanceof HTMLInputElement && constrainedInputTypes.indexOf(element.type) > -1))
   );
 }
 

tests/unit/dom/fill-in-test.js

@@ -254,4 +254,53 @@ module('DOM Helper: fillIn', function (hooks) {
       new Error("Can not `fillIn` with text: 'foo' that exceeds maxlength: '1'.")
     );
   });
+
+  test('filling in a non-constrained input type with maxlength', async function (assert) {
+    element = buildInstrumentedElement('input');
+    const maxLengthString = '1';
+    const tooLongString = maxLengthString.concat('23');
+    element.setAttribute('type', 'number');
+    element.setAttribute('maxlength', maxLengthString.length);
+    await setupContext(context);
+
+    await fillIn(element, tooLongString);
+
+    assert.verifySteps(clickSteps);
+    assert.equal(
+      element.value,
+      tooLongString,
+      'fillIn does not reject non-constrained input types'
+    );
+  });
+
+  test('filling a textarea with a maxlength with suitable value', async function (assert) {
+    element = buildInstrumentedElement('textarea');
+    const maxLengthString = 'f';
+    element.setAttribute('maxlength', maxLengthString.length);
+
+    await setupContext(context);
+
+    await fillIn(element, maxLengthString);
+
+    assert.verifySteps(clickSteps);
+    assert.equal(
+      element.value,
+      maxLengthString,
+      `fillIn respects textarea attribute [maxlength=${maxLengthString.length}]`
+    );
+  });
+
+  test('filling a textarea with a maxlength with too long value', async function (assert) {
+    element = buildInstrumentedElement('textarea');
+    const maxLengthString = 'f';
+    const tooLongString = maxLengthString.concat('oo');
+    element.setAttribute('maxlength', maxLengthString.length);
+
+    await setupContext(context);
+
+    assert.rejects(
+      fillIn(element, tooLongString),
+      new Error("Can not `fillIn` with text: 'foo' that exceeds maxlength: '1'.")
+    );
+  });
 });

tests/unit/dom/type-in-test.js

@@ -280,4 +280,57 @@ module('DOM Helper: typeIn', function (hooks) {
       new Error("Can not `typeIn` with text: 'fo' that exceeds maxlength: '1'.")
     );
   });
+
+  test('typing in a non-constrained input type with maxlength', async function (assert) {
+    element = buildInstrumentedElement('input');
+    const maxLengthString = '1';
+    const tooLongString = maxLengthString.concat('23');
+    element.setAttribute('type', 'number');
+    element.setAttribute('maxlength', maxLengthString.length);
+    await setupContext(context);
+
+    await typeIn(element, tooLongString);
+
+    assert.verifySteps(expectedEvents);
+    assert.equal(
+      element.value,
+      tooLongString,
+      'typeIn does not reject non-constrained input types'
+    );
+  });
+
+  test('typing in a textarea with a maxlength with suitable value', async function (assert) {
+    element = buildInstrumentedElement('textarea');
+    const maxLengthString = 'foo';
+    element.setAttribute('maxlength', maxLengthString.length);
+
+    await setupContext(context);
+
+    await typeIn(element, maxLengthString);
+
+    assert.verifySteps(expectedEvents);
+    assert.equal(
+      element.value,
+      maxLengthString,
+      `typeIn respects textarea attribute [maxlength=${maxLengthString.length}]`
+    );
+  });
+
+  test('typing in a textarea with a maxlength with too long value', async function (assert) {
+    element = buildInstrumentedElement('textarea');
+    const maxLengthString = 'f';
+    const tooLongString = maxLengthString.concat('o');
+    element.setAttribute('maxlength', maxLengthString.length);
+
+    await setupContext(context);
+
+    await assert.rejects(
+      typeIn(element, tooLongString).finally(() => {
+        // should throw before the second input event (or second keyup for IE)
+        const expectedNumberOfSteps = isIE11 ? 6 : 8;
+        assert.verifySteps(expectedEvents.slice(0, expectedNumberOfSteps));
+      }),
+      new Error("Can not `typeIn` with text: 'fo' that exceeds maxlength: '1'.")
+    );
+  });
 });