# Detect features

![](http://img.badgesize.io/TimvanScherpenzeel/detect-features/master/dist/detect-features.min.js.svg?compression=gzip&maxAge=60)
[![npm version](https://badge.fury.io/js/detect-features.svg)](https://badge.fury.io/js/detect-features)
[![dependencies](https://david-dm.org/timvanscherpenzeel/detect-features.svg)](https://david-dm.org/timvanscherpenzeel/detect-features)
[![devDependencies](https://david-dm.org/timvanscherpenzeel/detect-features/dev-status.svg)](https://david-dm.org/timvanscherpenzeel/detect-features#info=devDependencies)

Detect and report browser and hardware features.

## Demo

[Live demo](https://timvanscherpenzeel.github.io/detect-features/)

## Usage
```javascript
  DetectFeatures.register({
      log: true,
      element: document.getElementById('app'),
  });
```

## Installation

Make sure you have [Node.js](http://nodejs.org/) installed.

```sh
  npm install
```

## Development

```sh
  npm start

  npm run serve

  npm run lint

  npm run dist

  npm run deploy
```

## Reported features
```json
{
  "browserFeatures": {
    "browserType": {
      "browserEngineName": "WebKit",
      "browserEngineVersion": "537.36",
      "browserName": "Chrome",
      "browserVersion": "65.0.3325.146",
      "deviceModel": "Unknown",
      "deviceType": "Unknown",
      "deviceVendor": "Unknown",
      "operatingSystemName": "Mac OS",
      "operatingSystemVersion": "10.10.5"
    },
    "isGamepadSupported": true,
    "isLocalStorageSupported": true,
    "isPerformanceSupported": true,
    "isRequestIdleCallbackSupported": true,
    "isServiceWorkerSupported": true,
    "isWebAssemblySupported": true,
    "isWebAudioSupported": true,
    "isWebGL2Supported": true,
    "isWebGLSupported": true,
    "isWebRTCSupported": true,
    "isWebSocketSupported": true,
    "isWebVRSupported": false,
    "isWebWorkerSupported": true,
    "isWebXRSupported": false,
    "webGL2Features": {
      "base": {
        "shaderVersion": "WebGL GLSL ES 3.00 (OpenGL ES GLSL ES 3.0 Chromium)",
        "renderer": "WebKit WebGL",
        "rendererUnmasked": "Intel(R) Iris(TM) Graphics 6100",
        "vendor": "WebKit",
        "vendorUnmasked": "Intel",
        "version": "WebGL 2.0 (OpenGL ES 3.0 Chromium)"
      },
      "general": {
        "aliasedLineWidthRange": "1,1",
        "aliasedPointSizeRange": "1,255.875",
        "alphaBits": 8,
        "antialias": true,
        "blueBits": 8,
        "depthBits": 24,
        "greenBits": 8,
        "maxCombinedTextureImageUnits": 80,
        "maxCubeMapTextureSize": 16384,
        "maxFragmentUniformVectors": 1024,
        "maxRenderBufferSize": 16384,
        "maxTextureImageUnits": 16,
        "maxTextureSize": 16384,
        "maxVaryingVectors": 15,
        "maxVertexAttributes": 16,
        "maxVertexTextureImageUnits": 16,
        "maxVertexUniformVectors": 1024,
        "maxViewportDimensions": "16384,16384",
        "precision": {
          "fragmentShaderHighPrecision": "127,127,23",
          "fragmentShaderLowPrecision": "127,127,23",
          "fragmentShaderMediumPrecision": "127,127,23",
          "vertexShaderHighPrecision": "127,127,23",
          "vertexShaderLowPrecision": "127,127,23",
          "vertexShaderMediumPrecision": "127,127,23"
        },
        "redBits": 8,
        "stencilBits": 8,
        "subPixelBits": 8
      },
      "extensions": {
        "maxAnisotropy": 16,
        "supportedExtensions": {
          "EXT_color_buffer_float": true,
          "EXT_texture_filter_anisotropic": true,
          "OES_texture_float_linear": true,
          "WEBGL_compressed_texture_s3tc": true,
          "WEBGL_compressed_texture_s3tc_srgb": true,
          "WEBGL_debug_renderer_info": true,
          "WEBGL_debug_shaders": true,
          "WEBGL_lose_context": true
        }
      },
      "specific": {
        "max3DTextureSize": 2048,
        "maxArrayTextureLayers": 2048,
        "maxClientWaitTimeout": 0,
        "maxColorAttachments": 8,
        "maxCombinedFragmentUniformComponents": 249856,
        "maxCombinedVertexUniformComponents": 249856,
        "maxCombinedUniformBlocks": 75,
        "maxDrawBuffers": 8,
        "maxElementIndex": 4294967295,
        "maxElementsIndices": 150000,
        "maxElementsVertices": 1048575,
        "maxFragmentInputComponents": 128,
        "maxFragmentUniformBlocks": 15,
        "maxFragmentUniformComponents": 4096,
        "maxProgramTexelOffset": 7,
        "maxSamples": 8,
        "maxServerWaitTimeout": 0,
        "maxTextureLODBias": 16,
        "maxTransformFeedbackInterleavedComponents": 64,
        "maxTransformFeedbackSeparateAttribs": 4,
        "maxTransformFeedbackSeparateComponents": 4,
        "maxUniformBlockSize": 65536,
        "maxUniformBufferBindings": 75,
        "maxVaryingComponents": 60,
        "maxVertexUniformBlocks": 15,
        "maxVertexOutputComponents": 128,
        "maxVertexUniformComponents": 4096,
        "minProgramTexelOffset": -8,
        "uniformBufferOffsetAlignment": 256
      }
    },
    "webGLFeatures": {
      "base": {
        "shaderVersion": "WebGL GLSL ES 1.0 (OpenGL ES GLSL ES 1.0 Chromium)",
        "renderer": "WebKit WebGL",
        "rendererUnmasked": "Intel(R) Iris(TM) Graphics 6100",
        "vendor": "WebKit",
        "vendorUnmasked": "Intel",
        "version": "WebGL 1.0 (OpenGL ES 2.0 Chromium)"
      },
      "general": {
        "aliasedLineWidthRange": "1,1",
        "aliasedPointSizeRange": "1,255.875",
        "alphaBits": 8,
        "antialias": true,
        "blueBits": 8,
        "depthBits": 24,
        "greenBits": 8,
        "maxCombinedTextureImageUnits": 80,
        "maxCubeMapTextureSize": 16384,
        "maxFragmentUniformVectors": 1024,
        "maxRenderBufferSize": 16384,
        "maxTextureImageUnits": 16,
        "maxTextureSize": 16384,
        "maxVaryingVectors": 15,
        "maxVertexAttributes": 16,
        "maxVertexTextureImageUnits": 16,
        "maxVertexUniformVectors": 1024,
        "maxViewportDimensions": "16384,16384",
        "precision": {
          "fragmentShaderHighPrecision": "127,127,23",
          "fragmentShaderLowPrecision": "127,127,23",
          "fragmentShaderMediumPrecision": "127,127,23",
          "vertexShaderHighPrecision": "127,127,23",
          "vertexShaderLowPrecision": "127,127,23",
          "vertexShaderMediumPrecision": "127,127,23"
        },
        "redBits": 8,
        "stencilBits": 8,
        "subPixelBits": 8
      },
      "extensions": {
        "maxAnisotropy": 16,
        "maxDrawBuffers": 8,
        "supportedExtensions": {
          "ANGLE_instanced_arrays": true,
          "EXT_blend_minmax": true,
          "EXT_color_buffer_half_float": true,
          "EXT_frag_depth": true,
          "EXT_shader_texture_lod": true,
          "EXT_texture_filter_anisotropic": true,
          "WEBKIT_EXT_texture_filter_anisotropic": true,
          "EXT_sRGB": true,
          "OES_element_index_uint": true,
          "OES_standard_derivatives": true,
          "OES_texture_float": true,
          "OES_texture_float_linear": true,
          "OES_texture_half_float": true,
          "OES_texture_half_float_linear": true,
          "OES_vertex_array_object": true,
          "WEBGL_color_buffer_float": true,
          "WEBGL_compressed_texture_s3tc": true,
          "WEBKIT_WEBGL_compressed_texture_s3tc": true,
          "WEBGL_compressed_texture_s3tc_srgb": true,
          "WEBGL_debug_renderer_info": true,
          "WEBGL_debug_shaders": true,
          "WEBGL_depth_texture": true,
          "WEBKIT_WEBGL_depth_texture": true,
          "WEBGL_draw_buffers": true,
          "WEBGL_lose_context": true,
          "WEBKIT_WEBGL_lose_context": true
        }
      }
    }
  },
  "browserSettings": {
    "isCookieEnabled": true,
    "isDoNotTrackEnabled": false
  },
  "hardwareFeatures": {
    "devicePixelRatio": 2,
    "endianness": "little",
    "screenSize": "1280,800",
    "workerPoolSize": 4,
    "windowSize": "784,626"
  }
}
```

## Licence

My work is released under the [MIT license](https://raw.githubusercontent.com/TimvanScherpenzeel/detect-features/master/LICENSE).