Add support for number values with underscores

lb- · lb- · commit a3ad9463f0c5 · 2023-06-21T17:54:39.000+10:00
- Aligns with JavaScript numeric separators - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Lexical_grammar#numeric_separators - Example `data-wait-delay-value="7_000"` - Closes #646
diff --git a/docs/reference/actions.md b/docs/reference/actions.md
@@ -131,7 +131,7 @@ The list of supported modifier keys is shown below.
 
 Sometimes a controller needs to listen for events dispatched on the global `window` or `document` objects.
 
-You can append `@window` or `@document` to the event name (along with any filter modifier) in an action descriptor to install the event listener on `window` or `document`, respectively, as in the following example:
+You can append `@window` or `@document` to the event name (along with any filter modifer) in an action descriptor to install the event listener on `window` or `document`, respectively, as in the following example:
 
 <meta data-controller="callout" data-callout-text-value="resize@window">
 
diff --git a/docs/reference/values.md b/docs/reference/values.md
@@ -53,13 +53,13 @@ export default class extends Controller {
 
 A value's type is one of `Array`, `Boolean`, `Number`, `Object`, or `String`. The type determines how the value is transcoded between JavaScript and HTML.
 
-Type | Encoded as… | Decoded as…
----- | ----------- | -----------
-Array | `JSON.stringify(array)` | `JSON.parse(value)`
-Boolean | `boolean.toString()` | `!(value == "0" \|\| value == "false")`
-Number | `number.toString()` | `Number(value)`
-Object | `JSON.stringify(object)` | `JSON.parse(value)`
-String | Itself | Itself
+| Type    | Encoded as…              | Decoded as…                             |
+| ------- | ------------------------ | --------------------------------------- |
+| Array   | `JSON.stringify(array)`  | `JSON.parse(value)`                     |
+| Boolean | `boolean.toString()`     | `!(value == "0" \|\| value == "false")` |
+| Number  | `number.toString()`      | `Number(value.replace(/_/g, ""))`       |
+| Object  | `JSON.stringify(object)` | `JSON.parse(value)`                     |
+| String  | Itself                   | Itself                                  |
 
 ## Properties and Attributes
 
diff --git a/src/core/value_properties.ts b/src/core/value_properties.ts
@@ -248,7 +248,7 @@ const readers: { [type: string]: Reader } = {
   },
 
   number(value: string): number {
-    return Number(value)
+    return Number(value.replace(/_/g, ""))
   },
 
   object(value: string): object {
diff --git a/src/tests/modules/core/value_tests.ts b/src/tests/modules/core/value_tests.ts
@@ -46,6 +46,14 @@ export default class ValueTests extends ControllerTestCase(ValueController) {
     this.controller.numericValue = "" as any
     this.assert.equal(this.controller.numericValue, 0)
     this.assert.equal(this.get("numeric-value"), "")
+
+    // Number values should support Numeric separators
+    this.set("numeric-value", "7_150")
+    this.assert.equal(this.controller.numericValue, 7150)
+
+    // Number values should be written simply, without Numeric separators
+    this.controller.numericValue = 10500
+    this.assert.deepEqual(this.get("numeric-value"), "10500")
   }
 
   "test boolean values"() {
