Skip to content

Commit 118d2e7

Browse files
authored
Merge pull request #393 from webcomponents/get-attribute-names
Polyfill `Element#getAttributeNames`.
2 parents 903b81c + 4fce7c2 commit 118d2e7

File tree

5 files changed

+83
-0
lines changed

5 files changed

+83
-0
lines changed
Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
<!doctype html>
2+
<!--
3+
@license
4+
Copyright (c) 2020 The Polymer Project Authors. All rights reserved.
5+
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
6+
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
7+
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
8+
Code distributed by Google as part of the polymer project is also
9+
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
10+
-->
11+
<html>
12+
<head>
13+
<title>Element getAttributeNames</title>
14+
<script src="../node_modules/@webcomponents/webcomponentsjs/bundles/webcomponents-pf_dom.js"></script>
15+
<script src="./wct-config.js"></script>
16+
<script src="../node_modules/wct-browser-legacy/browser.js"></script>
17+
</head>
18+
<body>
19+
<script>
20+
suite('Element getAttributeNames', function() {
21+
test('Returns an array of attribute names', () => {
22+
const element = document.createElement('div');
23+
assert(element.getAttributeNames().length === 0);
24+
25+
let attributeNames;
26+
27+
attributeNames = element.getAttributeNames();
28+
assert.isArray(attributeNames);
29+
assert.deepEqual(attributeNames, []);
30+
31+
element.setAttribute('name-a', 'value-a');
32+
attributeNames = element.getAttributeNames();
33+
assert.deepEqual(attributeNames, ['name-a']);
34+
35+
element.setAttribute('name-b', 'value-b');
36+
attributeNames = element.getAttributeNames();
37+
assert.deepEqual(attributeNames, ['name-a', 'name-b']);
38+
39+
element.removeAttribute('name-a');
40+
attributeNames = element.getAttributeNames();
41+
assert.deepEqual(attributeNames, ['name-b']);
42+
43+
element.removeAttribute('name-b');
44+
attributeNames = element.getAttributeNames();
45+
assert.deepEqual(attributeNames, []);
46+
});
47+
});
48+
</script>
49+
</body>
50+
</html>

packages/tests/webcomponentsjs_/runner.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@
3434
'loader-after-load.html',
3535
'baseuri.html',
3636
'object-assign.html',
37+
'get-attribute-names.html',
3738
'parent-node/index.html',
3839
'child-node/index.html',
3940
'svg-element-class-list.html',

packages/webcomponentsjs/CHANGELOG.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,8 @@ Versioning](https://semver.org/spec/v2.0.0.html).
88

99
## [Unreleased]
1010

11+
- Polyfill `Element#getAttributeNames`.
12+
([#393](https://github.com/webcomponents/polyfills/pull/393))
1113
- Add polyfills for ChildNode APIs.
1214
([#390](https://github.com/webcomponents/polyfills/pull/390))
1315
- Add polyfills for select ParentNode APIs.

packages/webcomponentsjs/src/entrypoints/webcomponents-pf_dom-index.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
1010

1111
import '../platform/custom-event.js';
1212
import '../platform/baseuri.js';
13+
import '../platform/get-attribute-names.js';
1314
import '../platform/parent-node/index.js';
1415
import '../platform/child-node/index.js';
1516
import '../platform/svg-element-class-list.js';
Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
/**
2+
@license
3+
Copyright (c) 2020 The Polymer Project Authors. All rights reserved.
4+
This code may only be used under the BSD style license found at
5+
http://polymer.github.io/LICENSE.txt The complete set of authors may be found at
6+
http://polymer.github.io/AUTHORS.txt The complete set of contributors may be
7+
found at http://polymer.github.io/CONTRIBUTORS.txt Code distributed by Google as
8+
part of the polymer project is also subject to an additional IP rights grant
9+
found at http://polymer.github.io/PATENTS.txt
10+
*/
11+
12+
export {};
13+
14+
const Element_prototype = Element.prototype;
15+
// In IE11, the `attributes` descriptor is on `Node.prototype`.
16+
const attributesDescriptor =
17+
Object.getOwnPropertyDescriptor(Element_prototype, 'attributes') ??
18+
Object.getOwnPropertyDescriptor(Node.prototype, 'attributes');
19+
// In Safari 9, the `attributes` descriptor's getter is undefined. In Chrome 41,
20+
// the `attributes` descriptor is a data descriptor on each Element instance.
21+
const getAttributes = attributesDescriptor?.get ??
22+
function(this: Element) { return this.attributes; };
23+
const map = Array.prototype.map;
24+
25+
if (!Element_prototype.hasOwnProperty('getAttributeNames')) {
26+
Element_prototype.getAttributeNames = function getAttributeNames(this: Element): Array<string> {
27+
return map.call(getAttributes.call(this), attr => attr.name) as Array<string>;
28+
};
29+
}

0 commit comments

Comments
 (0)