cssify - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

lib/browser.js

@@ -6,3 +6,2 @@ 'use strict'
 
-  /* istanbul ignore if: HMR-related thing */
   if (style) {
@@ -14,3 +13,3 @@ cb(style)
     style = document.createElement('style')
-    style.id = fileName
+    if (fileName != null) style.id = fileName
     cb(style)
@@ -17,0 +16,0 @@ head.appendChild(style)

lib/process-css.js

@@ -34,7 +34,7 @@ 'use strict'
   var dirName = path.dirname(fileName)
-  var requirePath = path.relative(dirName, packagePath) || '.'
+  var requirePath = path.relative(dirName, packagePath)
 
   var moduleSource = options['auto-inject']
     ? [
-      'var inject = require(\'' + requirePath + '\');',
+      'var inject = require(\'./' + requirePath + '\');',
       'var css = ' + escapedCss + ';',
@@ -55,3 +55,3 @@ 'inject(css, undefined, \'' + hash(fileName) + '\');',
   if (options.modules) {
-    Core.scope.generateScopedName = options._flags.debug
+    Core.scope.generateScopedName = options.debug
       ? generateDebugName
@@ -58,0 +58,0 @@ : generateHashName

package.json

 {
   "name": "cssify",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "A simple Browserify transform for adding required styles to the browser.",
@@ -8,3 +8,3 @@ "main": "./lib/index.js",
     "pretest": "standard",
-    "test:browser": "browserify -t . -t browserify-istanbul test/browser | browser-run | node test/extract-coverage.js | tap-difflet",
+    "test:browser": "browserify -t [ . --no-auto-inject ] -t browserify-istanbul test/browser | browser-run | node test/extract-coverage.js | tap-difflet",
     "test:node": "istanbul cover --report json --print none ./node_modules/.bin/tape 'test/**/*.spec.js' | tap-difflet",
@@ -38,3 +38,3 @@ "test": "mkdir -p coverage && npm run test:node && npm run test:browser && istanbul report"
     "browser-run": "^3.0.3",
-    "browserify": "~3.32.1",
+    "browserify": "^12.0.1",
     "browserify-istanbul": "^0.2.1",
@@ -41,0 +41,0 @@ "concat-stream": "^1.5.1",

test/browser/basic/index.js

 'use strict'
 
-var test = require('tape-catch')
+var tapeCatch = require('tape-catch')
 var css = require('./style.css')
+var injectCss = require('../../..')
 
+var styleId = 'injection-testing'
+
+function test (desc, fn) {
+  tapeCatch(desc, function (t) {
+    try {
+      setTimeout(function () { fn(t) }, 0)
+    } catch (err) {
+      t.fail(err)
+    }
+  })
+}
+
 test('browser: basic usage', function (t) {
-  var position = window.getComputedStyle(document.body).position
+  t.equal(css, 'body { position: absolute; }\n', 'styles exported')
 
-  t.equal(css, 'body { position: absolute; }\n', 'styles exported')
-  t.equal(position, 'absolute', 'styles injected')
+  injectCss(css, undefined, styleId)
+  t.equal(
+    window.getComputedStyle(document.body).position,
+    'absolute',
+    'styles injected'
+  )
+
+  injectCss('body { width: 300px; }')
+  injectCss('body { font-size: 5px; }')
+
+  const computedStyle = window.getComputedStyle(document.body)
+
+  const actualStyles = {
+    position: computedStyle.position,
+    width: computedStyle.width,
+    fontSize: computedStyle.fontSize
+  }
+
+  const expectedStyles = {
+    position: 'absolute',
+    width: '300px',
+    fontSize: '5px'
+  }
+
+  t.deepEqual(actualStyles, expectedStyles, 'inject styles without an id')
   t.end()
 })
+
+test('browser: hot module replacement', function (t) {
+  injectCss('body { position: absolute; }\n', undefined, styleId)
+
+  t.equal(
+    window.getComputedStyle(document.body).position,
+    'absolute',
+    'first injection'
+  )
+
+  injectCss('', undefined, styleId)
+
+  t.equal(
+    window.getComputedStyle(document.body).position,
+    'static',
+    'second injection'
+  )
+
+  t.end()
+})

test/node/index.spec.js

@@ -6,11 +6,20 @@ 'use strict'
 var path = require('path')
+var stream = require('stream')
 var cssify = require('../../lib')
 
+// writable stream that just ignores everything written to it
+// similar to /dev/null in unix-like systems
+var devNull = new stream.Writable({
+  write: function (chunk, enc, next) {
+    next()
+  }
+})
+
 test('main module', function (t) {
-  t.doesNotThrow(function () {
-    browserify(path.join(__dirname, '..', 'browser', 'index.js'))
-      .transform(cssify)
-      .bundle()
-      .on('end', t.end)
-  })
+  browserify(path.join(__dirname, '..', 'browser', 'index.js'))
+    .transform(cssify)
+    .bundle()
+    .pipe(devNull)
+    .on('finish', t.end)
+    .on('error', t.fail)
 })

test/node/process-css.spec.js

@@ -37,3 +37,3 @@ 'use strict'
         moduleSource, [
-          'var inject = require(\'.\');',
+          'var inject = require(\'./\');',
           'var css = "' + escapedCss + '";',
@@ -65,3 +65,3 @@ 'inject(css, undefined, \'' + hashedFilename + '\');',
         moduleSource, [
-          'var inject = require(\'.\');',
+          'var inject = require(\'./\');',
           'var css = "' + prodCss + '";',
@@ -68,0 +68,0 @@ 'inject(css, undefined, \'' + hashedFilename + '\');',

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

32626

increased by138.84%

Number of package files

18

increased by5.88%

Lines of code

431

increased by13.42%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes