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

ember-cli-element-closest-polyfill

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().

web-framework

github ↗package ↗

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 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

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

Importing the module automatically applies the polyfill; there is no named export. Just import the package once, typically in app.js.

import '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.

// In ember-cli-build.js or as addon dependency: add 'ember-cli-element-closest-polyfill' to package.json dependencies

After polyfill, Element.closest works per spec (one argument). No extra arguments supported.

element.closest('.selector');

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 footguns

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.

deprecatedEmber CLI versions before 2.13 do not support the targets feature; the polyfill will always be included.

Upgrade

Version history

Breaking-change detection hasn't run for this library yet.

Audit

Security & dependencies

CVE tracking and dependency tree are planned for a later release.

Agent activity

9 hits · last 30 days

gptbot

ahrefsbot

script

Resources

githubhttps://github.com/miguelcobain/ember-cli-element-closest-polyfill ↗

packagehttps://www.npmjs.com/package/ember-cli-element-closest-polyfill ↗