stylecow-plugin-custom-media
Advanced tools
Comparing version 1.1.1 to 2.0.0
83
index.js
@@ -1,50 +0,49 @@ | ||
| module.exports = function (stylecow) { | ||
| "use strict"; | ||
| var allCustomMedia = {}; | ||
| module.exports = function (tasks) { | ||
| //Reset customMedia variable | ||
| stylecow.addTask({ | ||
| position: 'before', | ||
| fn: function (root) { | ||
| allCustomMedia = {}; | ||
| } | ||
| }); | ||
| var allCustomMedia = {}; | ||
| //Save all custom-media | ||
| stylecow.addTask({ | ||
| filter: { | ||
| type: 'AtRule', | ||
| name: 'custom-media' | ||
| }, | ||
| fn: function (customMedia) { | ||
| allCustomMedia[customMedia.get('ExtensionName').name] = customMedia.get('MediaQuery'); | ||
| customMedia.detach(); | ||
| } | ||
| }); | ||
| //Reset customMedia variable | ||
| tasks.addTask({ | ||
| position: 'before', | ||
| fn: function (root) { | ||
| allCustomMedia = {}; | ||
| } | ||
| }); | ||
| //Replace the custom-media | ||
| stylecow.addTask({ | ||
| filter: { | ||
| type: 'AtRule', | ||
| name: 'media' | ||
| }, | ||
| fn: function (media) { | ||
| media | ||
| .getAll('ExtensionName') | ||
| .forEach(function (extension) { | ||
| var mediaquery = allCustomMedia[extension.name]; | ||
| //Save all custom-media | ||
| tasks.addTask({ | ||
| filter: { | ||
| type: 'AtRule', | ||
| name: 'custom-media' | ||
| }, | ||
| fn: function (customMedia) { | ||
| allCustomMedia[customMedia.get('ExtensionName').name] = customMedia.get('MediaQuery'); | ||
| customMedia.detach(); | ||
| } | ||
| }); | ||
| if (mediaquery) { | ||
| var expression = extension.getParent('ConditionalExpression'); | ||
| //Replace the custom-media | ||
| tasks.addTask({ | ||
| filter: { | ||
| type: 'AtRule', | ||
| name: 'media' | ||
| }, | ||
| fn: function (media) { | ||
| media | ||
| .getAll('ExtensionName') | ||
| .forEach(function (extension) { | ||
| var mediaquery = allCustomMedia[extension.name]; | ||
| mediaquery.forEach(function (child) { | ||
| expression.before(child.clone()); | ||
| }); | ||
| if (mediaquery) { | ||
| let expression = extension.getParent('ConditionalExpression'); | ||
| expression.detach(); | ||
| //extension.getParent('ConditionalExpression').replaceWith(mediaqueries.clone()); | ||
| } | ||
| }); | ||
| } | ||
| }); | ||
| mediaquery.forEach(child => expression.before(child.clone())); | ||
| expression.detach(); | ||
| //extension.getParent('ConditionalExpression').replaceWith(mediaqueries.clone()); | ||
| } | ||
| }); | ||
| } | ||
| }); | ||
| }; |
| { | ||
| "name": "stylecow-plugin-custom-media", | ||
| "description": "Stylecow plugin to work with @custom-media", | ||
| "version": "1.1.1", | ||
| "version": "2.0.0", | ||
| "engines": { | ||
| "node": ">=4.0" | ||
| }, | ||
| "author": "Oscar Otero <oom@oscarotero.com>", | ||
@@ -13,4 +16,4 @@ "homepage": "https://github.com/stylecow/stylecow-plugin-custom-media", | ||
| "devDependencies": { | ||
| "mocha": "^2.2.5", | ||
| "stylecow-core": "^1.0.1" | ||
| "mocha": "^2.3.2", | ||
| "stylecow-core": "^2.0.0" | ||
| }, | ||
@@ -17,0 +20,0 @@ "scripts": { |
@@ -1,29 +0,20 @@ | ||
| var assert = require('assert'); | ||
| var stylecow = require('stylecow-core'); | ||
| stylecow | ||
| .loadNpmModule(__dirname + '/../index') | ||
| .minSupport({ | ||
| "explorer": 0, | ||
| "firefox": 0, | ||
| "chrome": 0, | ||
| "safari": 0, | ||
| "opera": 0, | ||
| "android": 0, | ||
| "ios": 0 | ||
| }) | ||
| .testCases(__dirname + '/cases', function (test) { | ||
| stylecow.run(test.css); | ||
| var tests = new stylecow.Test(__dirname + '/cases'); | ||
| var tasks = (new stylecow.Tasks()).use(require('../index')); | ||
| describe('cases/' + test.name, function() { | ||
| it('should match output.css', function() { | ||
| //test.write('output.css', test.css.toString()); | ||
| assert.equal(test.css.toString(), test.read('output.css')); | ||
| }); | ||
| tests.run(function (test) { | ||
| tasks.run(test.css); | ||
| it('should match ast.json', function() { | ||
| //test.writeJson('ast.json', test.css.toAst()); | ||
| assert.deepEqual(test.css.toAst(), test.readJson('ast.json')); | ||
| }); | ||
| }); | ||
| }); | ||
| describe('cases/' + test.name, function() { | ||
| it('should match output.css', function() { | ||
| //test.writeString() | ||
| test.assertString(); | ||
| }); | ||
| it('should match ast.json', function() { | ||
| //test.writeAst() | ||
| test.assertAst(); | ||
| }); | ||
| }); | ||
| }); |
| { | ||
| "class": "Root", | ||
| "type": "Root", | ||
| "children": [ | ||
| { | ||
| "class": "Media", | ||
| "type": "AtRule", | ||
| "name": "media", | ||
| "vendor": null, | ||
| "children": [ | ||
| { | ||
| "class": "MediaQueries", | ||
| "type": "MediaQueries", | ||
| "children": [ | ||
| { | ||
| "class": "MediaQuery", | ||
| "type": "MediaQuery", | ||
| "children": [ | ||
| { | ||
| "class": "ConditionalExpression", | ||
| "type": "ConditionalExpression", | ||
| "children": [ | ||
| { | ||
| "class": "ExtensionName", | ||
| "type": "ExtensionName", | ||
| "name": "viewport-max-s" | ||
@@ -28,15 +29,15 @@ } | ||
| { | ||
| "class": "Block", | ||
| "type": "Block", | ||
| "children": [ | ||
| { | ||
| "class": "Rule", | ||
| "type": "Rule", | ||
| "children": [ | ||
| { | ||
| "class": "Selectors", | ||
| "type": "Selectors", | ||
| "children": [ | ||
| { | ||
| "class": "Selector", | ||
| "type": "Selector", | ||
| "children": [ | ||
| { | ||
| "class": "TypeSelector", | ||
| "type": "TypeSelector", | ||
| "name": "body" | ||
@@ -49,6 +50,6 @@ } | ||
| { | ||
| "class": "Block", | ||
| "type": "Block", | ||
| "children": [ | ||
| { | ||
| "class": "Declaration", | ||
| "type": "Declaration", | ||
| "name": "font-size", | ||
@@ -58,10 +59,10 @@ "vendor": null, | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Unit", | ||
| "type": "Unit", | ||
| "name": "rem", | ||
| "children": [ | ||
| { | ||
| "class": "Number", | ||
| "type": "Number", | ||
| "name": 1 | ||
@@ -68,0 +69,0 @@ } |
| { | ||
| "class": "Root", | ||
| "type": "Root", | ||
| "children": [ | ||
| { | ||
| "class": "Media", | ||
| "type": "AtRule", | ||
| "name": "media", | ||
| "vendor": null, | ||
| "children": [ | ||
| { | ||
| "class": "MediaQueries", | ||
| "type": "MediaQueries", | ||
| "children": [ | ||
| { | ||
| "class": "MediaQuery", | ||
| "type": "MediaQuery", | ||
| "children": [ | ||
| { | ||
| "class": "ConditionalExpression", | ||
| "type": "ConditionalExpression", | ||
| "children": [ | ||
| { | ||
| "class": "ConditionalFeature", | ||
| "type": "ConditionalFeature", | ||
| "name": "max-width", | ||
@@ -23,10 +24,10 @@ "vendor": null, | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Unit", | ||
| "type": "Unit", | ||
| "name": "em", | ||
| "children": [ | ||
| { | ||
| "class": "Number", | ||
| "type": "Number", | ||
| "name": 30 | ||
@@ -47,6 +48,6 @@ } | ||
| { | ||
| "class": "Block", | ||
| "type": "Block", | ||
| "children": [ | ||
| { | ||
| "class": "Comment", | ||
| "type": "Comment", | ||
| "name": " narrow window styles " | ||
@@ -59,16 +60,17 @@ } | ||
| { | ||
| "class": "Media", | ||
| "type": "AtRule", | ||
| "name": "media", | ||
| "vendor": null, | ||
| "children": [ | ||
| { | ||
| "class": "MediaQueries", | ||
| "type": "MediaQueries", | ||
| "children": [ | ||
| { | ||
| "class": "MediaQuery", | ||
| "type": "MediaQuery", | ||
| "children": [ | ||
| { | ||
| "class": "ConditionalExpression", | ||
| "type": "ConditionalExpression", | ||
| "children": [ | ||
| { | ||
| "class": "ConditionalFeature", | ||
| "type": "ConditionalFeature", | ||
| "name": "max-width", | ||
@@ -78,10 +80,10 @@ "vendor": null, | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Unit", | ||
| "type": "Unit", | ||
| "name": "em", | ||
| "children": [ | ||
| { | ||
| "class": "Number", | ||
| "type": "Number", | ||
| "name": 30 | ||
@@ -98,3 +100,3 @@ } | ||
| { | ||
| "class": "Keyword", | ||
| "type": "Keyword", | ||
| "name": "and", | ||
@@ -104,6 +106,6 @@ "vendor": null | ||
| { | ||
| "class": "ConditionalExpression", | ||
| "type": "ConditionalExpression", | ||
| "children": [ | ||
| { | ||
| "class": "ConditionalFeatureBoolean", | ||
| "type": "ConditionalFeatureBoolean", | ||
| "name": "script" | ||
@@ -118,6 +120,6 @@ } | ||
| { | ||
| "class": "Block", | ||
| "type": "Block", | ||
| "children": [ | ||
| { | ||
| "class": "Comment", | ||
| "type": "Comment", | ||
| "name": " special styles for when script is allowed " | ||
@@ -124,0 +126,0 @@ } |
| { | ||
| "class": "Root", | ||
| "type": "Root", | ||
| "children": [ | ||
| { | ||
| "class": "Media", | ||
| "type": "AtRule", | ||
| "name": "media", | ||
| "vendor": null, | ||
| "children": [ | ||
| { | ||
| "class": "MediaQueries", | ||
| "type": "MediaQueries", | ||
| "children": [ | ||
| { | ||
| "class": "MediaQuery", | ||
| "type": "MediaQuery", | ||
| "children": [ | ||
| { | ||
| "class": "ConditionalExpression", | ||
| "type": "ConditionalExpression", | ||
| "children": [ | ||
| { | ||
| "class": "ConditionalFeature", | ||
| "type": "ConditionalFeature", | ||
| "name": "max-width", | ||
@@ -23,10 +24,10 @@ "vendor": null, | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Unit", | ||
| "type": "Unit", | ||
| "name": "em", | ||
| "children": [ | ||
| { | ||
| "class": "Number", | ||
| "type": "Number", | ||
| "name": 30 | ||
@@ -47,15 +48,15 @@ } | ||
| { | ||
| "class": "Block", | ||
| "type": "Block", | ||
| "children": [ | ||
| { | ||
| "class": "Rule", | ||
| "type": "Rule", | ||
| "children": [ | ||
| { | ||
| "class": "Selectors", | ||
| "type": "Selectors", | ||
| "children": [ | ||
| { | ||
| "class": "Selector", | ||
| "type": "Selector", | ||
| "children": [ | ||
| { | ||
| "class": "TypeSelector", | ||
| "type": "TypeSelector", | ||
| "name": "body" | ||
@@ -68,6 +69,6 @@ } | ||
| { | ||
| "class": "Block", | ||
| "type": "Block", | ||
| "children": [ | ||
| { | ||
| "class": "Declaration", | ||
| "type": "Declaration", | ||
| "name": "color", | ||
@@ -77,6 +78,6 @@ "vendor": null, | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Keyword", | ||
| "type": "Keyword", | ||
| "name": "blue", | ||
@@ -83,0 +84,0 @@ "vendor": null |
| { | ||
| "class": "Root", | ||
| "type": "Root", | ||
| "children": [ | ||
| { | ||
| "class": "Media", | ||
| "type": "AtRule", | ||
| "name": "media", | ||
| "vendor": null, | ||
| "children": [ | ||
| { | ||
| "class": "MediaQueries", | ||
| "type": "MediaQueries", | ||
| "children": [ | ||
| { | ||
| "class": "MediaQuery", | ||
| "type": "MediaQuery", | ||
| "children": [ | ||
| { | ||
| "class": "ConditionalExpression", | ||
| "type": "ConditionalExpression", | ||
| "children": [ | ||
| { | ||
| "class": "ConditionalFeature", | ||
| "type": "ConditionalFeature", | ||
| "name": "min-width", | ||
@@ -23,10 +24,10 @@ "vendor": null, | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Unit", | ||
| "type": "Unit", | ||
| "name": "px", | ||
| "children": [ | ||
| { | ||
| "class": "Number", | ||
| "type": "Number", | ||
| "name": 100 | ||
@@ -45,9 +46,9 @@ } | ||
| { | ||
| "class": "MediaQuery", | ||
| "type": "MediaQuery", | ||
| "children": [ | ||
| { | ||
| "class": "ConditionalExpression", | ||
| "type": "ConditionalExpression", | ||
| "children": [ | ||
| { | ||
| "class": "ConditionalFeature", | ||
| "type": "ConditionalFeature", | ||
| "name": "max-width", | ||
@@ -57,10 +58,10 @@ "vendor": null, | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Unit", | ||
| "type": "Unit", | ||
| "name": "px", | ||
| "children": [ | ||
| { | ||
| "class": "Number", | ||
| "type": "Number", | ||
| "name": 1000 | ||
@@ -81,15 +82,15 @@ } | ||
| { | ||
| "class": "Block", | ||
| "type": "Block", | ||
| "children": [ | ||
| { | ||
| "class": "Rule", | ||
| "type": "Rule", | ||
| "children": [ | ||
| { | ||
| "class": "Selectors", | ||
| "type": "Selectors", | ||
| "children": [ | ||
| { | ||
| "class": "Selector", | ||
| "type": "Selector", | ||
| "children": [ | ||
| { | ||
| "class": "TypeSelector", | ||
| "type": "TypeSelector", | ||
| "name": "body" | ||
@@ -102,6 +103,6 @@ } | ||
| { | ||
| "class": "Block", | ||
| "type": "Block", | ||
| "children": [ | ||
| { | ||
| "class": "Declaration", | ||
| "type": "Declaration", | ||
| "name": "color", | ||
@@ -111,6 +112,6 @@ "vendor": null, | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Keyword", | ||
| "type": "Keyword", | ||
| "name": "red", | ||
@@ -117,0 +118,0 @@ "vendor": null |
| { | ||
| "class": "Root", | ||
| "type": "Root", | ||
| "children": [ | ||
| { | ||
| "class": "Rule", | ||
| "type": "Rule", | ||
| "children": [ | ||
| { | ||
| "class": "Selectors", | ||
| "type": "Selectors", | ||
| "children": [ | ||
| { | ||
| "class": "Selector", | ||
| "type": "Selector", | ||
| "children": [ | ||
| { | ||
| "class": "TypeSelector", | ||
| "type": "TypeSelector", | ||
| "name": "body" | ||
@@ -22,6 +22,6 @@ } | ||
| { | ||
| "class": "Block", | ||
| "type": "Block", | ||
| "children": [ | ||
| { | ||
| "class": "Declaration", | ||
| "type": "Declaration", | ||
| "name": "color", | ||
@@ -31,6 +31,6 @@ "vendor": null, | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Hex", | ||
| "type": "Hex", | ||
| "name": "000" | ||
@@ -47,16 +47,17 @@ } | ||
| { | ||
| "class": "Media", | ||
| "type": "AtRule", | ||
| "name": "media", | ||
| "vendor": null, | ||
| "children": [ | ||
| { | ||
| "class": "MediaQueries", | ||
| "type": "MediaQueries", | ||
| "children": [ | ||
| { | ||
| "class": "MediaQuery", | ||
| "type": "MediaQuery", | ||
| "children": [ | ||
| { | ||
| "class": "ConditionalExpression", | ||
| "type": "ConditionalExpression", | ||
| "children": [ | ||
| { | ||
| "class": "ExtensionName", | ||
| "type": "ExtensionName", | ||
| "name": "undefined-custom-media" | ||
@@ -71,15 +72,15 @@ } | ||
| { | ||
| "class": "Block", | ||
| "type": "Block", | ||
| "children": [ | ||
| { | ||
| "class": "Rule", | ||
| "type": "Rule", | ||
| "children": [ | ||
| { | ||
| "class": "Selectors", | ||
| "type": "Selectors", | ||
| "children": [ | ||
| { | ||
| "class": "Selector", | ||
| "type": "Selector", | ||
| "children": [ | ||
| { | ||
| "class": "TypeSelector", | ||
| "type": "TypeSelector", | ||
| "name": "body" | ||
@@ -92,6 +93,6 @@ } | ||
| { | ||
| "class": "Block", | ||
| "type": "Block", | ||
| "children": [ | ||
| { | ||
| "class": "Declaration", | ||
| "type": "Declaration", | ||
| "name": "font-size", | ||
@@ -101,10 +102,10 @@ "vendor": null, | ||
| { | ||
| "class": "Value", | ||
| "type": "Value", | ||
| "children": [ | ||
| { | ||
| "class": "Unit", | ||
| "type": "Unit", | ||
| "name": "rem", | ||
| "children": [ | ||
| { | ||
| "class": "Number", | ||
| "type": "Number", | ||
| "name": 1 | ||
@@ -111,0 +112,0 @@ } |
No alert changes
Improved metrics
- Total package byte prevSize
- increased by0.84%
20146
Worsened metrics
- Lines of code
- decreased by-0.76%
654
No dependency changes