Skip to content

Commit 38a8b85

Browse files
author
Steve Orvell
authored
Removes index signature from PropertyDeclaration (#929)
Fixes #928. Also add tests that type custom property options in a variety of ways.
1 parent 6a4c94f commit 38a8b85

File tree

2 files changed

+34
-5
lines changed

2 files changed

+34
-5
lines changed

src/lib/updating-element.ts

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -113,9 +113,6 @@ export interface PropertyDeclaration<Type = unknown, TypeHint = unknown> {
113113
*/
114114
readonly noAccessor?: boolean;
115115

116-
// Allows extension while preserving the ability to use the
117-
// @property decorator.
118-
[index: string]: unknown;
119116
}
120117

121118
/**

src/test/lib/updating-element_test.ts

Lines changed: 34 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1868,6 +1868,12 @@ suite('UpdatingElement', () => {
18681868
observer?: (oldValue: TypeHint) => void;
18691869
}
18701870

1871+
interface MyPropertyDeclarations {
1872+
readonly [key: string]: PropertyDeclaration|MyPropertyDeclaration;
1873+
}
1874+
1875+
const myProperty = (options: MyPropertyDeclaration) => property(options);
1876+
18711877
@customElement(generateElementName())
18721878
class E extends UpdatingElement {
18731879

@@ -1902,7 +1908,8 @@ suite('UpdatingElement', () => {
19021908
});
19031909
}
19041910

1905-
@property({type: Number, validator: (value: number) => Math.min(10, Math.max(value, 0))})
1911+
// provide custom deorator expecting extended type
1912+
@myProperty({type: Number, validator: (value: number) => Math.min(10, Math.max(value, 0))})
19061913
foo = 5;
19071914

19081915
@property({})
@@ -1911,23 +1918,48 @@ suite('UpdatingElement', () => {
19111918
// tslint:disable-next-line:no-any
19121919
_observedZot?: any;
19131920

1914-
@property({observer: function(this: E, oldValue: string) { this._observedZot = {value: this.zot, oldValue}; } })
1921+
// tslint:disable-next-line:no-any
1922+
_observedZot2?: any;
1923+
1924+
// use regular decorator and cast to type
1925+
@property({observer: function(this: E, oldValue: string) { this._observedZot = {value: this.zot, oldValue}; } } as PropertyDeclaration)
19151926
zot = '';
1927+
1928+
zot2 = '';
1929+
1930+
foo2 = 5;
1931+
1932+
// custom typed properties
1933+
static get properties(): MyPropertyDeclarations {
1934+
return {
1935+
// object cast as type
1936+
zot2: {observer: function(this: E, oldValue: string) { this._observedZot2 = {value: this.zot2, oldValue}; } } as PropertyDeclaration,
1937+
// object satisfying defined custom type.
1938+
foo2: {type: Number, validator: (value: number) => Math.min(10, Math.max(value, 0))}
1939+
};
1940+
}
19161941
}
19171942

19181943
const el = new E();
19191944
container.appendChild(el);
19201945
await el.updateComplete;
19211946
el.foo = 20;
1947+
el.foo2 = 20;
19221948
assert.equal(el.foo, 10);
1949+
assert.equal(el.foo2, 10);
19231950
assert.deepEqual(el._observedZot, {value: '', oldValue: undefined});
1951+
assert.deepEqual(el._observedZot2, {value: '', oldValue: undefined});
19241952
el.foo = -5;
1953+
el.foo2 = -5;
19251954
assert.equal(el.foo, 0);
1955+
assert.equal(el.foo2, 0);
19261956
el.bar = 'bar2';
19271957
assert.equal(el.bar, 'bar2');
19281958
el.zot = 'zot';
1959+
el.zot2 = 'zot';
19291960
await el.updateComplete;
19301961
assert.deepEqual(el._observedZot, {value: 'zot', oldValue: ''});
1962+
assert.deepEqual(el._observedZot2, {value: 'zot', oldValue: ''});
19311963
});
19321964

19331965
test('attribute-based property storage', async () => {

0 commit comments

Comments
 (0)