Analyze vendor prefixed @Keyframes (#131)

* add tests for vendor prefixed keyframes

* add prefixed keyframes analysis

Author: bartveneman

readme.md

@@ -53,6 +53,10 @@ analyze('foo{}')
 //   'atrules.keyframes.total': 0,
 //   'atrules.keyframes.totalUnique': 0,
 //   'atrules.keyframes.unique': [],
+//   'atrules.keyframes.prefixed.total': 0,
+//   'atrules.keyframes.prefixed.totalUnique': 0,
+//   'atrules.keyframes.prefixed.unique': [],
+//   'atrules.keyframes.prefixed.share': 0,
 //   'atrules.mediaqueries.total': 0,
 //   'atrules.mediaqueries.totalUnique': 0,
 //   'atrules.mediaqueries.unique': [],

src/analyzer/atrules/keyframes.js

@@ -1,20 +1,19 @@
+const isVendorPrefixed = require('is-vendor-prefixed')
 const uniquer = require('../../utils/uniquer')
 
 module.exports = atRules => {
-  const all = atRules
-    .filter(rule => {
-      return [
-        'keyframes',
-        '-moz-keyframes',
-        '-webkit-keyframes',
-        '-ms-keyframes',
-        '-o-keyframes'
-      ].includes(rule.type)
-    })
-    .map(rule => rule.params)
+  const all = atRules.filter(rule => rule.type.includes('keyframes'))
+  const prefixed = all
+    .filter(rule => isVendorPrefixed(rule.type))
+    .map(rule => `@${rule.type} ${rule.params}`)
 
   return {
     total: all.length,
-    ...uniquer(all)
+    ...uniquer(all.map(rule => rule.params)),
+    prefixed: {
+      total: prefixed.length,
+      ...uniquer(prefixed),
+      share: prefixed.length === 0 ? 0 : all.length / prefixed.length
+    }
   }
 }

test/analyzer/atrules/keyframes.js

@@ -32,7 +32,13 @@ test('it responds with the correct structure', t => [
   t.deepEqual(analyze([]), {
     total: 0,
     totalUnique: 0,
-    unique: []
+    unique: [],
+    prefixed: {
+      total: 0,
+      totalUnique: 0,
+      unique: [],
+      share: 0
+    }
   })
 ])
 
@@ -57,6 +63,69 @@ test('it counts unique @keyframes', t => {
   t.is(actual, 2)
 })
 
+test('it finds all vendor prefixed keyframes', t => {
+  const fixture = [
+    {
+      type: '-webkit-keyframes',
+      params: 'ANIMATION'
+    },
+    {
+      type: '-moz-keyframes',
+      params: 'ANIMATION'
+    },
+    {
+      type: '-ms-keyframes',
+      params: 'ANIMATION'
+    },
+    {
+      type: '-o-keyframes',
+      params: 'ANIMATION'
+    }
+  ]
+  const {prefixed: actual} = analyze(fixture)
+
+  t.is(actual.total, 4)
+  t.is(actual.totalUnique, 4)
+  t.is(actual.share, 1)
+  t.deepEqual(actual.unique, [
+    {
+      count: 1,
+      value: '@-moz-keyframes ANIMATION'
+    },
+    {
+      count: 1,
+      value: '@-ms-keyframes ANIMATION'
+    },
+    {
+      count: 1,
+      value: '@-o-keyframes ANIMATION'
+    },
+    {
+      count: 1,
+      value: '@-webkit-keyframes ANIMATION'
+    }
+  ])
+})
+
+test('it does not report non-vendor prefixed keyframes as prefixed', t => {
+  const fixture = [
+    {
+      type: 'keyframes',
+      params: 'ANIMATION'
+    },
+    {
+      type: 'keyframes',
+      params: '-webkit-animation-name'
+    }
+  ]
+  const {prefixed: actual} = analyze(fixture)
+
+  t.is(actual.total, 0)
+  t.is(actual.totalUnique, 0)
+  t.is(actual.share, 0)
+  t.deepEqual(actual.unique, [])
+})
+
 test('it does not report non-@keyframes atrules as @keyframes', t => {
   const actual = analyze([
     {
@@ -69,9 +138,7 @@ test('it does not report non-@keyframes atrules as @keyframes', t => {
     }
   ])
 
-  t.deepEqual(actual, {
-    total: 0,
-    totalUnique: 0,
-    unique: []
-  })
+  t.is(actual.total, 0)
+  t.is(actual.totalUnique, 0)
+  t.deepEqual(actual.unique, [])
 })

test/analyzer/index.js

@@ -33,6 +33,10 @@ test('Returns the correct analysis object structure', async t => {
     'atrules.keyframes.total': 0,
     'atrules.keyframes.totalUnique': 0,
     'atrules.keyframes.unique': [],
+    'atrules.keyframes.prefixed.total': 0,
+    'atrules.keyframes.prefixed.totalUnique': 0,
+    'atrules.keyframes.prefixed.unique': [],
+    'atrules.keyframes.prefixed.share': 0,
     'atrules.mediaqueries.total': 0,
     'atrules.mediaqueries.totalUnique': 0,
     'atrules.mediaqueries.unique': [],