<commit_before># Feature

Detecting those host environment features for you. [See what your browser supports][5]

## Example

```
<script src="cdn/../feature.js"></script>
<script>
    if ([
        "DOM.EventTarget.addEventListener",
        "DOM.Element.classList",
        "DOM.Element.append",
        "DOM.Element.before",
        "DOM.Node.textContent"
    ].every(function (v) { return window.features[v] })) {
        console.log("your browser has modern DOM features!");
    }
</script>
```

## Motivation

 - Dynamic APIs
 - Only polyfilling the missing features
 - Quickly check what host features your browser has

## Documentation

### features

`window.features` is a global object containing all the features that are present in this browser. If the feature is present it's value is `true` and `false` if the feature test failed.

```
if (features["DOM.EventTarget.addEventListener"]) {
    window.addEventListener("click", handler);
} else {
    window.attachEvent("onclick", handler);
}
```

The [tests file][5] shows the list of features currently being detected. It's encourage that rather then use the entire file, you build your own file using only the features you want.

Currently the easiest way to make a custom build is to

 - clone this project
 - delete any files from lib/features you don't want
 - run `node build.js`
 - take your fresh feature.js file and use it

### Dynamic APIS

Dynamic APIs require you to feature detect any part of the host environment you want to use. This is an extension of the progressive enhancement technique.

The basic idea is that you have a HTML/CSS page that works. Then include a javascript enhancement file which checks whether the host environment has the features it needs. If it has them (either natively or by polyfill) it will safely enhance the page without throwing an error. If the browser doesn't have the features then rather then throwing a run-time error it will just do nothing.<commit_msg>Fixed a few grammar mistakes.<commit_after># Feature

Detecting those host environment features for you. [See what your browser supports][5]

## Example

```
<script src="cdn/../feature.js"></script>
<script>
    if ([
        "DOM.EventTarget.addEventListener",
        "DOM.Element.classList",
        "DOM.Element.append",
        "DOM.Element.before",
        "DOM.Node.textContent"
    ].every(function (v) { return window.features[v] })) {
        console.log("your browser has modern DOM features!");
    }
</script>
```

## Motivation

 - Dynamic APIs
 - Only polyfilling the missing features
 - Quickly check what host features your browser has

## Documentation

### features

`window.features` is a global object containing all the features that are present in this browser. If the feature is present its value is `true` and `false` if the feature test failed.

```
if (features["DOM.EventTarget.addEventListener"]) {
    window.addEventListener("click", handler);
} else {
    window.attachEvent("onclick", handler);
}
```

The [tests file][5] shows the list of features currently being detected. It's encouraged that rather then use the entire file, you build your own file using only the features you want.

Currently the easiest way to make a custom build is to

 - clone this project
 - delete any files from lib/features you don't want
 - run `node build.js`
 - take your fresh feature.js file and use it

### Dynamic APIS

Dynamic APIs require you to feature detect any part of the host environment you want to use. This is an extension of the progressive enhancement technique.

The basic idea is that you have a HTML/CSS page that works. Then include a javascript enhancement file which checks whether the host environment has the features it needs. If it has them (either natively or by polyfill) it will safely enhance the page without throwing an error. If the browser doesn't have the features then rather then throwing a run-time error it will just do nothing.
{'fraction_non_alphanumeric': 0.08396560445118867, 'fraction_numerical': 0.0010116337885685382, 'mean_word_length': 3.7650602409638556, 'pattern_counts': {'":': 0, '<': 11, '<?xml version=': 0, '>': 11, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5225541', 'n_tokens_mistral': 1021, 'n_tokens_neox': 976, 'n_words': 503}