Registry / web-framework / ember-cli-element-closest-polyfill

ember-cli-element-closest-polyfill

JSON →
library0.0.2jsnpmunverified

Ember CLI addon that polyfills Element.closest() and Element.matches() for browsers lacking support (IE11 and lower). Version 0.0.2 is the latest release, last updated on npm in 2019. Based on jonathantneal's element-closest polyfill. It uses Ember CLI's targets feature to conditionally include the polyfill only when needed, reducing bundle size. Differentiators: automatic inclusion based on browser targets, supports nested addon usage, and also polyfills Element.matches().

npm install ember-cli-element-closest-polyfill
INSTALL
IMPORT
SIG · EMBER-CLI-ELEMENT-
E
ember-cli-element-closest-polyfill
web-frameworkjavascriptv0.0.2
Install
Import
Disk
Pass rate
0/ 6
Env Coverage0 / 6
glibc
1822
musl
1822
Install & Compatibility
Where this runs
tested against v? · npm install
Install × environment matrix
Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux
musl
node 18226 runs
build_error
glibc
node 18226 runs
build_error
Code
Verified usage

Verified import paths — ran on the pinned version, not inferred.

default
import 'ember-cli-element-closest-polyfill';
import { closest } from 'ember-cli-element-closest-polyfill';
Importing the module automatically applies the polyfill; there is no named export. Just import the package once, typically in app.js.
addon
// In ember-cli-build.js or as addon dependency: add 'ember-cli-element-closest-polyfill' to package.json dependencies
import { polyfill } from 'ember-cli-element-closest-polyfill';
This is an Ember CLI addon; consumption is via 'ember install' or adding to package.json. No JS import is needed manually; the addon handles the polyfill.
Element.closest
element.closest('.selector');
element.closest('.selector', context);
After polyfill, Element.closest works per spec (one argument). No extra arguments supported.

Installs the addon and shows usage of Element.closest in an Ember component after polyfill is applied.

# Install the addon in your Ember app ember install ember-cli-element-closest-polyfill # After installation, you can use element.closest() in your Ember components or controllers. // Example in a component: import Component from '@glimmer/component'; import { action } from '@ember/object'; export default class MyComponent extends Component { @action handleClick(event) { const button = event.target.closest('button'); if (button) { console.log('Clicked a button:', button); } } }
Debug
Known issues
gotchaThe polyfill is auto-included based on browser targets; if you need it unconditionally (e.g., in an addon), ensure your target configuration includes older browsers.
fix
Set your Ember CLI targets in config/targets.js to include browsers like 'ie 11' to force inclusion of the polyfill.
affects: >=0.0.0
deprecatedEmber CLI versions before 2.13 do not support the targets feature; the polyfill will always be included.
fix
Update Ember CLI to >=2.13 to leverage conditional polyfill inclusion.
affects: <0.0.0
Errors
Common errors & fixes
closest is undefined
Browser does not support Element.closest and polyfill is not included (e.g., targets exclude IE11).
fix
Ensure your target configuration includes browsers that need the polyfill, such as 'ie 11' in config/targets.js.
Cannot find module 'ember-cli-element-closest-polyfill'
Addon not installed or not listed in package.json dependencies.
fix
Run 'ember install ember-cli-element-closest-polyfill' to add it to your project.
Upgrade
Version history
0.0.2latest on npm
Audit
Dependencies

No dependency data recorded yet.

Agent activity
2 hits · last 30 days
node
2
Resources
ember-cli-element-closest-polyfill — npm install ember-cli-element-closest-polyfill · libregistry