From 898f0c224b155810596ea76115fcdc43fb777f8d Mon Sep 17 00:00:00 2001
From: Victor Elci <victor.elci@aboveproperty.com>
Date: Tue, 24 Oct 2023 13:47:49 -0400
Subject: [PATCH] fixes for value passed to onUpdate hook * don't pass back
 invalid values * strip spaces

---
 addon/components/input-credit-card-number.js  | 10 ++++++--
 .../input-credit-card-number-test.js          | 24 +++++++++++++++++++
 2 files changed, 32 insertions(+), 2 deletions(-)

diff --git a/addon/components/input-credit-card-number.js b/addon/components/input-credit-card-number.js
index c7710cb..20234ee 100644
--- a/addon/components/input-credit-card-number.js
+++ b/addon/components/input-credit-card-number.js
@@ -7,8 +7,12 @@ import isDigitKeypress from 'ember-credit-cards/utils/is-digit-keypress';
 
 const cardFromNumber = cards.fromNumber;
 
+function stripSpaces(value) {
+  return (value + '').replace(/\D/g, '');
+}
+
 function inputValid(value) {
-  value = (value + '').replace(/\D/g, '');
+  value = stripSpaces(value);
 
   var card = cardFromNumber(value);
 
@@ -25,7 +29,9 @@ export default class InputCreditCardNumberComponent extends Component {
   }
 
   set number(value) {
-    this.args.onUpdate(value);
+    if (inputValid(value)) {
+      this.args.onUpdate(stripSpaces(value));
+    }
   }
 
   @action
diff --git a/tests/integration/components/input-credit-card-number-test.js b/tests/integration/components/input-credit-card-number-test.js
index 45720c0..ad55514 100644
--- a/tests/integration/components/input-credit-card-number-test.js
+++ b/tests/integration/components/input-credit-card-number-test.js
@@ -19,4 +19,28 @@ module('Integration | Component | input-credit-card-number', function (hooks) {
     await typeIn('input', '5');
     assert.equal(this.element.querySelector('input').value, '4242 45');
   });
+
+  test('it should return a value without spaces', async function (assert) {
+    this.set('number', '');
+    this.set('onUpdate', (value) => {
+      this.set('number', value);
+    });
+    await render(
+      hbs`<InputCreditCardNumber @number={{this.number}} @onUpdate={{this.onUpdate}} />`
+    );
+    await typeIn('input', '41111');
+    assert.equal(this.number, '41111');
+  });
+
+  test("it shouldn't call onUpdate with an invalid length", async function (assert) {
+    this.set('number', '4111111111111111');
+    this.set('onUpdate', (value) => {
+      this.set('number', value);
+    });
+    await render(
+      hbs`<InputCreditCardNumber @number={{this.number}} @onUpdate={{this.onUpdate}} />`
+    );
+    await typeIn('input', '1');
+    assert.equal(this.number, '4111111111111111');
+  });
 });