esl Exadel Smart Library
  • Core
  • Components
  • Examples
Get started
Exadel Smart Library
  • Search
  • Introduction
    • Installation Guide
    • Browser Support
    • Our Roadmap
  • Core
    • ESL Base Element
    • new ESL Mixin Element
    • ESL Media Query
    • ESL Traversing Query
    • new ESL Event Listeners
    • ESL Utils
  • Components
    • beta ESL A11y Group
    • ESL Alert
    • beta ESL Animate
    • beta ESL Footnotes
    • ESL Image
    • ESL Media
    • ESL Panel
    • ESL Panel Group
    • beta ESL Popup
    • ESL Scrollbar
    • beta ESL Select
    • beta ESL Select List
    • ESL Tabs
    • ESL Toggleable
    • ESL Trigger
  • Examples
    • Accordion
    • beta Animate
    • Embedded Audio
    • Embedded Video
    • beta Footnotes
    • Image
    • Menu
    • Notification
    • beta Popup
    • Scrollbar
    • beta Select Dropdown
    • beta Select List
    • Tabs
    • Toggleable

Browser Support

Exadel Smart Library does not have dependencies but uses the following list of native browser features:

  • ECMAScript 6 features
    • Array.from (no Iterable Objects support required) (ESL polyfill provided)
    • Array.prototype.find (ESL polyfill provided)
    • Array.prototype.findIndex (ESL polyfill provided)
    • Array.prototype.include (ESL polyfill provided)
    • Object.is (ESL polyfill provided)
    • Object.assign (accurate polyfill required) (ESL polyfill provided)
    • ES6 Promise
  • Web API
    • Event constructor + preventDefault polyfill
    • Custom Event constructor
    • Node.isConnected
    • Element.matches
    • Element.closest
    • Element.toggleAttribute
    • KeyboardEvent.key
    • IntersectionObserver
    • ResizeObserver
    • Custom Elements

All of them are fully supported by modern browsers such as Chrome, Firefox, Safari or Edge (>43).

In order to make ESL work in older browsers, you can use a "light" polyfills list of IntersectionObserver, ResizeObserver and Custom Elements (for older versions of Edge and Safari).

Or make the library work in IE11 or Edge (<14) by using the "full" polyfills list provided.

See more details on what polyfill approach might look like in the demo pages source code.

Also, ESL has built-in polyfills for some of DOM and ES6 features. They are available under polyfills directory:

  • ECMA Script 5: output shim (HTMLElement constructor call) - es5-target-shim.ts
  • ECMA Script 5: IE11, Edge <14 support - polyfills.es5.ts
    • Object.is, Object.assign
    • Array.from, Array.prototype.find, Array.prototype.findIndex, Array.prototype.index
    • Event, CustomEvent, MouseEvent, KeyboardEvent, FocusEvent shim
    • Event.prototype.preventDefault shim
    • Element.prototype.closest
    • DOMTokenList.prototype.toggle
    • Note: there is no promise polyfill embedded, use npm:promise-polyfill or similar
  • ECMA Script 6: DOM - polyfills.es6.ts
    • Node.isConnected
    • KeyboardKey.prototype.key
    • Element.prototype.toggleAttribute

ESL v4.2.0 © 2023 Exadel, Inc
Core Team Contributors: Alexey Stsefanovich, Julia Murashko, Yuliya Adamskaya, Dmytro Shovchko, Anna Barmina, Anastasiya Lesun
Design by Iryna Pavlenko