Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Replace Element with HTMLElement where appropriate #182

Merged
merged 1 commit into from
Jun 8, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
30 changes: 15 additions & 15 deletions src/inert.js
Original file line number Diff line number Diff line change
Expand Up @@ -52,14 +52,14 @@
*/
class InertRoot {
/**
* @param {!Element} rootElement The Element at the root of the inert subtree.
* @param {!HTMLElement} rootElement The HTMLElement at the root of the inert subtree.
* @param {!InertManager} inertManager The global singleton InertManager object.
*/
constructor(rootElement, inertManager) {
/** @type {!InertManager} */
this._inertManager = inertManager;

/** @type {!Element} */
/** @type {!HTMLElement} */
this._rootElement = rootElement;

/**
Expand Down Expand Up @@ -184,7 +184,7 @@
if (node.nodeType !== Node.ELEMENT_NODE) {
return;
}
const element = /** @type {!Element} */ (node);
const element = /** @type {!HTMLElement} */ (node);

// If a descendant inert root becomes un-inert, its descendants will still be inert because of
// this inert root, so all of its managed nodes need to be adopted by this InertRoot.
Expand Down Expand Up @@ -227,7 +227,7 @@

/**
* If a descendant node is found with an `inert` attribute, adopt its managed nodes.
* @param {!Element} node
* @param {!HTMLElement} node
*/
_adoptInertRoot(node) {
let inertSubroot = this._inertManager.getInertRoot(node);
Expand All @@ -251,7 +251,7 @@
*/
_onMutation(records, self) {
records.forEach(function(record) {
const target = /** @type {!Element} */ (record.target);
const target = /** @type {!HTMLElement} */ (record.target);
if (record.type === 'childList') {
// Manage added nodes
slice.call(record.addedNodes).forEach(function(node) {
Expand Down Expand Up @@ -334,7 +334,7 @@
this._throwIfDestroyed();

if (this._node && this._node.nodeType === Node.ELEMENT_NODE) {
const element = /** @type {!Element} */ (this._node);
const element = /** @type {!HTMLElement} */ (this._node);
if (this._savedTabIndex !== null) {
element.setAttribute('tabindex', this._savedTabIndex);
} else {
Expand Down Expand Up @@ -398,7 +398,7 @@
if (this.node.nodeType !== Node.ELEMENT_NODE) {
return;
}
const element = /** @type {!Element} */ (this.node);
const element = /** @type {!HTMLElement} */ (this.node);
if (matches.call(element, _focusableElementsString)) {
if (/** @type {!HTMLElement} */ (element).tabIndex === -1 &&
this.hasSavedTabIndex) {
Expand Down Expand Up @@ -495,7 +495,7 @@

/**
* Set whether the given element should be an inert root or not.
* @param {!Element} root
* @param {!HTMLElement} root
* @param {boolean} inert
*/
setInert(root, inert) {
Expand Down Expand Up @@ -624,7 +624,7 @@
if (record.attributeName !== 'inert') {
return;
}
const target = /** @type {!Element} */ (record.target);
const target = /** @type {!HTMLElement} */ (record.target);
const inert = target.hasAttribute('inert');
_this.setInert(target, inert);
break;
Expand All @@ -636,13 +636,13 @@
/**
* Recursively walk the composed tree from |node|.
* @param {!Node} node
* @param {(function (!Element))=} callback Callback to be called for each element traversed,
* @param {(function (!HTMLElement))=} callback Callback to be called for each element traversed,
* before descending into child nodes.
* @param {?ShadowRoot=} shadowRootAncestor The nearest ShadowRoot ancestor, if any.
*/
function composedTreeWalk(node, callback, shadowRootAncestor) {
if (node.nodeType == Node.ELEMENT_NODE) {
const element = /** @type {!Element} */ (node);
const element = /** @type {!HTMLElement} */ (node);
if (callback) {
callback(element);
}
Expand Down Expand Up @@ -720,17 +720,17 @@
node.appendChild(style);
}

if (!Element.prototype.hasOwnProperty('inert')) {
if (!HTMLElement.prototype.hasOwnProperty('inert')) {
/** @type {!InertManager} */
const inertManager = new InertManager(document);

Object.defineProperty(Element.prototype, 'inert', {
Object.defineProperty(HTMLElement.prototype, 'inert', {
enumerable: true,
/** @this {!Element} */
/** @this {!HTMLElement} */
get: function() {
return this.hasAttribute('inert');
},
/** @this {!Element} */
/** @this {!HTMLElement} */
set: function(inert) {
inertManager.setInert(this, inert);
},
Expand Down
6 changes: 3 additions & 3 deletions test/specs/element.spec.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
describe('Element.prototype', function() {
it('should patch the Element prototype', function() {
expect(Element.prototype.hasOwnProperty('inert')).to.be.ok;
describe('HTMLElement.prototype', function() {
it('should patch the HTMLElement prototype', function() {
expect(HTMLElement.prototype.hasOwnProperty('inert')).to.be.ok;
});
});
2 changes: 1 addition & 1 deletion test/specs/helpers/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ LOG.info = function() {
* Check if an element is not focusable.
* Note: This will be injected into the global scope by the test runner.
* See the files array in karma.conf.js.
* @param {Element} el
* @param {HTMLElement} el
* @return {Boolean}
*/
function isUnfocusable(el) { // eslint-disable-line no-unused-vars
Expand Down