postcss-prefixwrap - npm Package Compare versions

Comparing version 1.3.0 to 1.4.0

CHANGELOG.md

@@ -1,2 +0,1 @@
-
 # Changelog
@@ -6,91 +5,101 @@
 
-## 1.3.0 [![Build Status](https://travis-ci.org/dbtedman/postcss-prefixwrap.svg?branch=1.3.0)](https://travis-ci.org/dbtedman/postcss-prefixwrap)
+## 1.4.0
 
 ### Features and Improvements
 
-* Implement a more robust `@keyframes` detection, preserving `from` and `to` inside `@keyframes`. [#22](https://github.com/dbtedman/postcss-prefixwrap/pull/22)
+-   Project cleanup.
+-   Include Current Node Versions in Testing [#30](https://github.com/dbtedman/postcss-prefixwrap/issues/30)
+-   PostCSS Should be a Peer Dependency not Dependency [#28](https://github.com/dbtedman/postcss-prefixwrap/issues/28)
+-   Use Modern JS (ES6+) [#29](https://github.com/dbtedman/postcss-prefixwrap/issues/29)
+-   Prettier
 
+## 1.3.0
+
+### Features and Improvements
+
+-   Implement a more robust `@keyframes` detection, preserving `from` and `to` inside `@keyframes`. [#22](https://github.com/dbtedman/postcss-prefixwrap/pull/22)
+
 ### Bug Fixes
 
-* Stop ESLint from searching for config files in parent folders. [#23](https://github.com/dbtedman/postcss-prefixwrap/pull/23)
+-   Stop ESLint from searching for config files in parent folders. [#23](https://github.com/dbtedman/postcss-prefixwrap/pull/23)
 
-## 1.2.0 [![Build Status](https://travis-ci.org/dbtedman/postcss-prefixwrap.svg?branch=1.2.0)](https://travis-ci.org/dbtedman/postcss-prefixwrap)
+## 1.2.0
 
 ### Features and Improvements
 
-* Add code coverage reporting to ensure all parts of the code are being exercised by the tests.
-* Additional test coverage to exercise error condition handling for invalid css.
-* Introduction of integration testing suite.
+-   Add code coverage reporting to ensure all parts of the code are being exercised by the tests.
+-   Additional test coverage to exercise error condition handling for invalid css.
+-   Introduction of integration testing suite.
 
 ### Bug Fixes
 
-* Keyframe percentages are incorrectly prefixed. [#17](https://github.com/dbtedman/postcss-prefixwrap/issues/17)
+-   Keyframe percentages are incorrectly prefixed. [#17](https://github.com/dbtedman/postcss-prefixwrap/issues/17)
 
-## 1.1.3 [![Build Status](https://travis-ci.org/dbtedman/postcss-prefixwrap.svg?branch=1.1.3)](https://travis-ci.org/dbtedman/postcss-prefixwrap)
+## 1.1.3
 
 ### Bug Fixes
 
-* Selectors containing the word "body" or "html" treated as root. [#6](https://github.com/dbtedman/postcss-prefixwrap/issues/6)
+-   Selectors containing the word "body" or "html" treated as root. [#6](https://github.com/dbtedman/postcss-prefixwrap/issues/6)
 
-## 1.1.2 [![Build Status](https://travis-ci.org/dbtedman/postcss-prefixwrap.svg?branch=1.1.2)](https://travis-ci.org/dbtedman/postcss-prefixwrap)
+## 1.1.2
 
 ### Bug Fixes
 
-* Support for multiline selectors.
+-   Support for multiline selectors.
 
-## 1.1.1 [![Build Status](https://travis-ci.org/dbtedman/postcss-prefixwrap.svg?branch=1.1.1)](https://travis-ci.org/dbtedman/postcss-prefixwrap)
+## 1.1.1
 
 ### Features and Improvements
 
-* Updates to support disabling of html/body replacement.
-* Enable support for multiple selectors.
+-   Updates to support disabling of html/body replacement.
+-   Enable support for multiple selectors.
 
-## 1.0.1 [![Build Status](https://travis-ci.org/dbtedman/postcss-prefixwrap.svg?branch=1.0.1)](https://travis-ci.org/dbtedman/postcss-prefixwrap)
+## 1.0.1
 
 ### Features and Improvements
 
-* Updates to README contents.
+-   Updates to README contents.
 
-## 1.0.0 [![Build Status](https://travis-ci.org/dbtedman/postcss-prefixwrap.svg?branch=1.0.0)](https://travis-ci.org/dbtedman/postcss-prefixwrap)
+## 1.0.0
 
 ### Features and Improvements
 
-* Updated npm dependencies to explicitly define versions.
+-   Updated npm dependencies to explicitly define versions.
 
-## 0.2.2 [![Build Status](https://travis-ci.org/dbtedman/postcss-prefixwrap.svg?branch=0.2.2)](https://travis-ci.org/dbtedman/postcss-prefixwrap)
+## 0.2.2
 
 ### Features and Improvements
 
-* Expanded ESLint coverage to validate test scripts.
-* Extracted contributor details into `CONTRIBUTING.md` file and simplified project `README.md`.
+-   Expanded ESLint coverage to validate test scripts.
+-   Extracted contributor details into `CONTRIBUTING.md` file and simplified project `README.md`.
 
-## 0.2.1 [![Build Status](https://travis-ci.org/dbtedman/postcss-prefixwrap.svg?branch=0.2.1)](https://travis-ci.org/dbtedman/postcss-prefixwrap)
+## 0.2.1
 
 ### Features and Improvements
 
-* Added test for our container selector matching existing selector.
+-   Added test for our container selector matching existing selector.
 
-## 0.2.0 [![Build Status](https://travis-ci.org/dbtedman/postcss-prefixwrap.svg?branch=0.2.0)](https://travis-ci.org/dbtedman/postcss-prefixwrap)
+## 0.2.0
 
 ### Features and Improvements
 
-* Added Mocha Unit tests.
+-   Added Mocha Unit tests.
 
-## 0.1.0 [![Build Status](https://travis-ci.org/dbtedman/postcss-prefixwrap.svg?branch=0.1.0)](https://travis-ci.org/dbtedman/postcss-prefixwrap)
+## 0.1.0
 
 ### Features and Improvements
 
-* Add support for top level combined selectors containing our container class.
+-   Add support for top level combined selectors containing our container class.
 
-## 0.0.5 [![Build Status](https://travis-ci.org/dbtedman/postcss-prefixwrap.svg?branch=0.0.5)](https://travis-ci.org/dbtedman/postcss-prefixwrap)
+## 0.0.5
 
 ### Bug Fixes
 
-* Updated ignores to help npm.
+-   Updated ignores to help npm.
 
-## 0.0.4 [![Build Status](https://travis-ci.org/dbtedman/postcss-prefixwrap.svg?branch=0.0.4)](https://travis-ci.org/dbtedman/postcss-prefixwrap)
+## 0.0.4
 
 ### Features and Improvements
 
-* Initial repository scaffold.
-* Basic plugin implementation.
+-   Initial repository scaffold.
+-   Basic plugin implementation.

CONTRIBUTING.md

@@ -0,4 +1,3 @@
+# Contributing Guide
 
-# Contributing Guide for PostCSS Prefix Wrap
-
 ## Testing and Code Quality
@@ -8,6 +7,10 @@
 
-* [Travis CI](https://travis-ci.org/dbtedman/postcss-prefixwrap) - *Used for running the test suite on every commit.*
-* [Code Climate](https://codeclimate.com/github/dbtedman/postcss-prefixwrap) - *Used for test coverage and maintainability analysis.*
-* [Synx](https://snyk.io/test/github/dbtedman/postcss-prefixwrap) - *Used to identify security vulnerabilities in package dependencies.*
+[Travis CI](https://travis-ci.org/dbtedman/postcss-prefixwrap)
 
+### Code Formatting
+
+```bash
+npm run format
+```
+
 ### Static Analysis
@@ -21,7 +24,5 @@
 
-Dependency version checks are performed by [Dependabot](https://dependabot.com/). Any necessary changes will be requested automatically via pull requests.
-
 ### Unit Tests
 
-Code is unit tested using [MochaJS](https://mochajs.org), using test cases defined in the `test-unit/` directory.
+Code is unit tested using [MochaJS](https://mochajs.org), using test cases defined in the `unit/` directory.
 
@@ -34,3 +35,3 @@ ```bash
 
-Code is integration tested using [MochaJS](https://mochajs.org), using test cases defined in the `test-integration/` directory.
+Code is integration tested using [MochaJS](https://mochajs.org), using test cases defined in the `integration/` directory.
 
@@ -37,0 +38,0 @@ ```bash

LICENSE.md

@@ -1,2 +0,1 @@
-
 MIT License
@@ -3,0 +2,0 @@

package.json

 {
   "name": "postcss-prefixwrap",
-  "version": "1.3.0",
+  "version": "1.4.0",
   "description": "A PostCSS plugin that is used to wrap css styles with a css selector to constrain their affect on parent elements in a page.",
@@ -8,6 +8,7 @@ "main": "./src/main.js",
     "test": "npm run test:lint && npm run test:unit && npm run test:integration",
-    "test:lint": "eslint --color ./src ./test-unit",
-    "test:unit": "nyc --reporter=text --reporter=lcov mocha --colors ./test-unit",
-    "test:integration": "npm run test:integration:prep && mocha --colors ./test-integration",
-    "test:integration:prep": "gulp --gulpfile=./test-integration/fixtures/gulpfile.js css"
+    "test:lint": "eslint --color ./src ./unit",
+    "test:unit": "nyc --reporter=text --reporter=lcov mocha --colors ./unit",
+    "test:integration": "npm run test:integration:prep && mocha --colors ./integration",
+    "test:integration:prep": "gulp --gulpfile=./integration/fixtures/gulpfile.js css",
+    "format": "prettier ./**/*.{js,md,yml,yaml,json} --write"
   },
@@ -20,14 +21,17 @@ "authors": [
   "repository": "https://github.com/dbtedman/postcss-prefixwrap",
-  "dependencies": {
-    "postcss": "6.0.14"
+  "peerDependencies": {
+    "postcss": "6.x"
   },
   "devDependencies": {
-    "eslint": "4.14.0",
-    "eslint-config-defaults": "9.0.0",
+    "@types/mocha": "5.2.5",
+    "ajv": "6.5.4",
+    "eslint": "5.7.0",
     "fs-extra": "5.0.0",
-    "gulp": "3.9.1",
-    "gulp-postcss": "7.0.1",
+    "gulp": "4.0.0",
+    "gulp-postcss": "8.0.0",
     "mocha": "4.1.0",
-    "nyc": "11.4.1"
+    "nyc": "13.1.0",
+    "postcss": "6.0.14",
+    "prettier": "1.15.3"
   }
 }

README.md

@@ -1,61 +0,47 @@
-
 # [PostCSS Prefix Wrap](https://github.com/dbtedman/postcss-prefixwrap)
 
 [![Build Status](https://travis-ci.org/dbtedman/postcss-prefixwrap.svg?branch=master)](https://travis-ci.org/dbtedman/postcss-prefixwrap)
-[![NPM Version](https://img.shields.io/npm/v/postcss-prefixwrap.svg)](https://www.npmjs.com/package/postcss-prefixwrap) 
-[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](LICENSE.md)
-[![Maintainability](https://api.codeclimate.com/v1/badges/fa0627fb4cfdc2a6dd04/maintainability)](https://codeclimate.com/github/dbtedman/postcss-prefixwrap/maintainability)
-[![Test Coverage](https://api.codeclimate.com/v1/badges/fa0627fb4cfdc2a6dd04/test_coverage)](https://codeclimate.com/github/dbtedman/postcss-prefixwrap/test_coverage)
 [![Known Vulnerabilities](https://snyk.io/test/github/dbtedman/postcss-prefixwrap/badge.svg)](https://snyk.io/test/github/dbtedman/postcss-prefixwrap)
 
-A [PostCSS](http://postcss.org) plugin that is used to wrap css styles with a css selector to constrain their affect on parent elements in a page.
+A [PostCSS](http://postcss.org) plugin which prepends a selector to CSS styles to constrain their effect on parent elements in a page.
 
 ## Where do I start?
 
-> These instructions are only for this plugin, see [PostCSS](http://postcss.org) website for framework information.
+> These instructions are only for this plugin. See the [PostCSS](http://postcss.org) website for framework information.
 
-1\. Install the plugin.
+### Install
 
-**[Yarn](https://yarnpkg.com/en/package/postcss-prefixwrap):**
+Using [NPM](https://www.npmjs.com)
 
 ```bash
-yarn add --dev postcss-prefixwrap
+npm install postcss-prefixwrap --save-dev --save-exact
 ```
 
-**[NPM](https://www.npmjs.com/package/postcss-prefixwrap):**
+### Configure
 
-```bash
-npm install --save-dev postcss-prefixwrap
-```
+Add to your [PostCSS](http://postcss.org) configuration.
 
-2\. Add to your [PostCSS](http://postcss.org) configuration.
-
-
 ```javascript
-var gulp = require('gulp');
-var postcss = require('gulp-postcss');
-var prefixwrap = require("postcss-prefixwrap"); // The require for PostCSS Prefix Wrap.
+const Gulp = require("gulp");
+const PostCSS = require("gulp-postcss");
+const PrefixWrap = require("postcss-prefixwrap");
 
-gulp.task("css", function () {
-    var processors = [
-        prefixwrap(".my-custom-wrap")
-    ];
-    return gulp.src("./src/*.css")
-        .pipe(postcss(processors))
-        .pipe(gulp.dest("./dest"));
-});
+Gulp.task("css", () =>
+    Gulp.src("./src/*.css")
+        .pipe(PostCSS([PrefixWrap(".my-custom-wrap")]))
+        .pipe(Gulp.dest("./dest"))
+);
 ```
 
-> The above example is using Gulp.js, and is based on [https://github.com/postcss/gulp-postcss](https://github.com/postcss/gulp-postcss) README.md.
+### Container
 
-3\. Add the container to your markup.
+Add the container to your markup.
 
 ```html
-<div class="my-custom-wrap">
-<!-- Your existing markup. -->
-</div>
+<div class="my-custom-wrap"><!-- Your existing markup. --></div>
 ```
 
-4\. View your css, now prefix wrapped.
+### View
 
+View your CSS, now prefix-wrapped.
 
@@ -66,7 +52,7 @@ **Before**
 p {
-  color: red;
+    color: red;
 }
 
 body {
-  font-size: 16px;
+    font-size: 16px;
 }
@@ -79,7 +65,7 @@ ```
 .my-custom-wrap p {
-  color: red;
+    color: red;
 }
 
 .my-custom-wrap {
-  font-size: 16px;
+    font-size: 16px;
 }
@@ -90,8 +76,5 @@ ```
 
-See our [Contributing Guide](CONTRIBUTING.md) for details on how the sausage is made.
-
-## Who built it?
-
-Created [Down Under](https://en.wikipedia.org/wiki/Australia) by [Daniel Tedman](https://danieltedman.com) and [Jeff Teng](https://jafoteng.co) with [contributions from around the web](https://github.com/dbtedman/postcss-prefixwrap/graphs/contributors).
-
-[![Australia](https://danieltedman.com/images/Australia.png)](https://en.wikipedia.org/wiki/Australia)
+-   See our [Contributing Guide](CONTRIBUTING.md) for details on how this repository is developed.
+-   See our [Changelog](CHANGELOG.md) for details on which features, improvements, and bug fixes have been implemented
+-   See our [License](LICENSE.md) for details on how you can use the code in this repository.
+-   See our [Security Guide](SECURITY.md) for details on how security is considered.

src/main.js

@@ -1,91 +0,4 @@
-var postcss = require("postcss");
+const Plugin = require("./PostCSSPrefixWrap/Plugin");
 
-(function () {
-
-  "use strict";
-
-  /**
-   * @param {String} prefixSelector
-   * @param {Object} options
-   */
-  function PostCSSPrefixWrap(prefixSelector, options) {
-    this.anyWhitespaceAtBeginningOrEnd = /(^\s*|\s*$)/g;
-    this.isPrefixSelector = new RegExp("^\s*" + prefixSelector + ".*$");
-    this.isRootTag = /^(body|html).*$/;
-    this.prefixRootTags = options !== undefined && options.hasOwnProperty("prefixRootTags") ? options.prefixRootTags : false;
-    this.prefixSelector = prefixSelector;
-  }
-
-  /**
-   * @param {String} cssSelector
-   * @returns {Boolean}
-   */
-  PostCSSPrefixWrap.prototype.invalidCSSSelectors = function (cssSelector) {
-    return cssSelector !== null;
-  };
-
-  /**
-   * @param cssSelector
-   * @param cssRule
-   * @returns {null|String}
-   */
-  PostCSSPrefixWrap.prototype.prefixWrapCSSSelector = function (cssSelector, cssRule) {
-    var that = this;
-
-    var cleanSelector = cssSelector.replace(that.anyWhitespaceAtBeginningOrEnd, "");
-
-    if (cleanSelector === "") {
-      return null;
-    }
-
-    if (cssRule.parent.type === "atrule" && ["keyframes", "-webkit-keyframes", "-moz-keyframes", "-o-keyframes"].indexOf(cssRule.parent.name) !== -1) {
-      return cleanSelector;
-    }
-
-    // Anything other than a root tag is always prefixed.
-    if (!cleanSelector.match(that.isRootTag)) {
-      return that.prefixSelector + " " + cleanSelector;
-    }
-
-    // Handle special case where root tags should be converted into classes rather than being replaced.
-    if (that.prefixRootTags) {
-      return that.prefixSelector + " ." + cleanSelector;
-    }
-
-    // HTML and Body elements cannot be contained within our container so lets extract their styles.
-    return cleanSelector.replace(/^(body|html)/, that.prefixSelector);
-  };
-
-  /**
-   * @param {Rule} cssRule
-   */
-  PostCSSPrefixWrap.prototype.prefixWrapCSSRule = function (cssRule) {
-    var that = this;
-
-    // We have found our prefix selector, we just want to leave it as it is already.
-    if (!cssRule.selector.match(that.isPrefixSelector)) {
-      cssRule.selector = cssRule.selector
-        .split(",")
-        .map(function (cssSelector) {
-          return that.prefixWrapCSSSelector(cssSelector, cssRule);
-        })
-        .filter(that.invalidCSSSelectors)
-        .join(", ");
-    }
-  };
-
-  PostCSSPrefixWrap.prototype.asPlugin = function () {
-    var that = this;
-
-    return function (css) {
-      css.walkRules(function (cssRule) {
-        that.prefixWrapCSSRule(cssRule);
-      });
-    };
-  };
-
-  module.exports = postcss.plugin("postcss-prefixwrap", function (prefixSelector, options) {
-    return new PostCSSPrefixWrap(prefixSelector, options).asPlugin();
-  });
-
-}());
+// Expose our class as a PostCSS Plugin.
+module.exports = Plugin.asPostCSSPlugin();

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Number of package files

38

increased by11.76%

Lines of code

470

increased by22.72%

Worsened metrics

Total package byte prevSize

21786

decreased by-82.88%

Dev dependency count

10

increased by42.86%

Number of lines in readme file

78

decreased by-17.89%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Addedpostcss@6.0.23(transitive)

• - Removedpostcss@6.0.14

• - Removedhas-flag@2.0.0(transitive)

• - Removedpostcss@6.0.14(transitive)

• - Removedsupports-color@4.5.0(transitive)