diff --git a/src/core/data_map.ts b/src/core/data_map.ts index 35480678..5f970aef 100644 --- a/src/core/data_map.ts +++ b/src/core/data_map.ts @@ -43,6 +43,6 @@ export class DataMap { } getAttributeNameForKey(key: string): string { - return `data-${this.identifier}-${dasherize(key)}` + return `data-${this.identifier.toLowerCase()}-${dasherize(key)}` } } diff --git a/src/tests/modules/core/value_tests_case_insensitive.ts b/src/tests/modules/core/value_tests_case_insensitive.ts new file mode 100644 index 00000000..3efdb4ff --- /dev/null +++ b/src/tests/modules/core/value_tests_case_insensitive.ts @@ -0,0 +1,92 @@ +import ValueTests from "./value_tests" + +export default class ValueCaseInsensitiveTests extends ValueTests { + identifier = "Test" + + fixtureHTML = ` +
+
+ ` + + async "test changed callbacks"() { + this.assert.deepEqual(this.controller.loggedNumericValues, [123]) + this.assert.deepEqual(this.controller.oldLoggedNumericValues, [0]) + + this.controller.numericValue = 0 + await this.nextFrame + this.assert.deepEqual(this.controller.loggedNumericValues, [123, 0]) + this.assert.deepEqual(this.controller.oldLoggedNumericValues, [0, 123]) + + this.set("numeric-value", "1") + await this.nextFrame + this.assert.deepEqual(this.controller.loggedNumericValues, [123, 0, 1]) + this.assert.deepEqual(this.controller.oldLoggedNumericValues, [0, 123, 0]) + } + + async "test changed callbacks for object"() { + this.assert.deepEqual(this.controller.optionsValues, [{ one: [2, 3] }]) + this.assert.deepEqual(this.controller.oldOptionsValues, [{}]) + + this.controller.optionsValue = { person: { name: "John", age: 42, active: true } } + await this.nextFrame + this.assert.deepEqual(this.controller.optionsValues, [ + { one: [2, 3] }, + { person: { name: "John", age: 42, active: true } }, + ]) + this.assert.deepEqual(this.controller.oldOptionsValues, [{}, { one: [2, 3] }]) + + this.set("options-value", "{}") + await this.nextFrame + this.assert.deepEqual(this.controller.optionsValues, [ + { one: [2, 3] }, + { person: { name: "John", age: 42, active: true } }, + {}, + ]) + this.assert.deepEqual(this.controller.oldOptionsValues, [ + {}, + { one: [2, 3] }, + { person: { name: "John", age: 42, active: true } }, + ]) + } + + async "test default values trigger changed callbacks"() { + this.assert.deepEqual(this.controller.loggedMissingStringValues, [""]) + this.assert.deepEqual(this.controller.oldLoggedMissingStringValues, [undefined]) + + this.controller.missingStringValue = "hello" + await this.nextFrame + this.assert.deepEqual(this.controller.loggedMissingStringValues, ["", "hello"]) + this.assert.deepEqual(this.controller.oldLoggedMissingStringValues, [undefined, ""]) + + this.controller.missingStringValue = undefined as any + await this.nextFrame + this.assert.deepEqual(this.controller.loggedMissingStringValues, ["", "hello", ""]) + this.assert.deepEqual(this.controller.oldLoggedMissingStringValues, [undefined, "", "hello"]) + } + + has(name: string) { + return this.element.hasAttribute(this.attr(name)) + } + + get(name: string) { + return this.element.getAttribute(this.attr(name)) + } + + set(name: string, value: string) { + return this.element.setAttribute(this.attr(name), value) + } + + attr(name: string) { + return `data-${this.identifier}-${name}` + } + + get element() { + return this.controller.element + } +}