DOM Feature Support Detection

0.0.2 · abandoned · verified Tue Apr 21

dom-support is a JavaScript library originally extracted from jQuery, designed to detect various browser rendering and styling quirks. It provides a simple object where properties (e.g., `opacity`, `leadingWhitespace`, `boxSizing`) are booleans indicating support or specific browser behaviors that deviate from standards. The package version 0.0.2 was last published over a decade ago. It addresses issues prevalent in browsers like IE6/7/8, older WebKit, and pre-standard implementations. This library is now largely obsolete as modern browsers have converged on standards, making its checks mostly irrelevant for contemporary web development. It has no discernible release cadence and is no longer actively maintained. Its primary differentiator was its comprehensive set of quirk detections based on extensive real-world testing from a major library like jQuery.

Common errors

```
ReferenceError: require is not defined
```
cause Attempting to use `require()` in an ECMAScript Module (ESM) environment (e.g., Node.js with `"type": "module"` or directly in browsers).

fix This package is CommonJS. Use a bundler like Webpack or Rollup configured to handle CJS modules, or rewrite your code to use native ESM imports for modern libraries. This package is not designed for direct ESM usage.
```
SyntaxError: Named export 'default' not found. The requested module 'dom-support' does not provide an export named 'default'
```
cause Attempting to `import support from 'dom-support'` or `import { support } from 'dom-support'` in an ESM context.

fix This package does not export a default or named export for ESM. It only provides a CommonJS `module.exports`. If you must use it, you'll need a CommonJS interop solution in your build pipeline or to stick to `require()` in a CJS context.

Warnings

breaking This package is effectively abandoned and targets browser quirks from over a decade ago (e.g., IE6-8, older WebKit versions). Its findings are almost entirely irrelevant for modern web development, and including it will only add unnecessary bundle size.
Fix: Do not use this package in new projects. For modern feature detection, rely on built-in browser APIs or a maintained, targeted polyfill/feature-detection library (e.g., Modernizr, although even that is less critical today).
gotcha The package is CommonJS-only. Attempting to use `import` syntax directly in an ESM module without a transpiler like Webpack or Rollup configured for CJS interop will result in errors.
Fix: If you absolutely must use this deprecated package in a modern ESM context, configure your bundler to handle CommonJS modules (e.g., using `@rollup/plugin-commonjs` for Rollup) or use `require()` in a CJS file and then import that CJS file.
gotcha The properties provided by `dom-support` are boolean flags indicating the *presence* of a quirk or a feature, not necessarily its ideal behavior. For example, `support.opacity` indicates if the `opacity` CSS property exists, not whether an IE `filter` equivalent is needed.
Fix: Thoroughly understand the specific quirk being detected if you are using this library. For contemporary feature detection, prefer `typeof window.CSS.supports === 'function'` or direct property checks (`'property' in document.body.style`).

Install

npm install dom-support npm
yarn add dom-support yarn
pnpm add dom-support pnpm

Imports

support
wrong:
```
import support from 'dom-support';
import * as support from 'dom-support';
```
correct:
```
const support = require('dom-support');
```
This package is CommonJS-only and was developed before widespread ESM adoption. Direct ESM `import` statements will not work without a CommonJS-to-ESM transpilation layer.

Quickstart

Initializes the dom-support library and logs a selection of detected browser quirks. Demonstrates how to access feature flags.

const support = require('dom-support');

console.log('--- DOM Support Features ---');
console.log(`Opacity support: ${support.opacity}`);
console.log(`Leading whitespace stripped by innerHTML (IE quirk): ${support.leadingWhitespace}`);
console.log(`Tbody auto-inserted into empty tables (IE quirk): ${support.tbody}`);
console.log(`HTML5 element cloning works correctly: ${support.html5Clone}`);
console.log(`Box sizing property support: ${support.boxSizing}`);
console.log(`Check for reliable hidden offsets (IE8 quirk): ${support.reliableHiddenOffsets}`);
console.log(`Radio button value maintained after append: ${support.radioValue}`);
console.log(`Cloning nodes copies event handlers (IE quirk): ${support.noCloneEvent}`);

// In a modern browser environment, most of these will be 'true' for standard behavior.

view raw JSON →