diff options
Diffstat (limited to 'node_modules/rucksack-css/test')
23 files changed, 343 insertions, 0 deletions
diff --git a/node_modules/rucksack-css/test/fixtures/alias.css b/node_modules/rucksack-css/test/fixtures/alias.css new file mode 100644 index 00000000..ad4c00ad --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/alias.css @@ -0,0 +1,11 @@ +@alias { + fs: font-size; + fw: font-weight; + bg: background; +} + +.foo { + fs: 16px; + fw: 400; + bg: #fff; +}
\ No newline at end of file diff --git a/node_modules/rucksack-css/test/fixtures/alias.expected.css b/node_modules/rucksack-css/test/fixtures/alias.expected.css new file mode 100644 index 00000000..27d718de --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/alias.expected.css @@ -0,0 +1,5 @@ +.foo { + font-size: 16px; + font-weight: 400; + background: #fff; +}
\ No newline at end of file diff --git a/node_modules/rucksack-css/test/fixtures/autoprefixer.css b/node_modules/rucksack-css/test/fixtures/autoprefixer.css new file mode 100644 index 00000000..ea300bc8 --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/autoprefixer.css @@ -0,0 +1,3 @@ +.foo { + display: flex +} diff --git a/node_modules/rucksack-css/test/fixtures/autoprefixer.expected.css b/node_modules/rucksack-css/test/fixtures/autoprefixer.expected.css new file mode 100644 index 00000000..a54f36c3 --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/autoprefixer.expected.css @@ -0,0 +1,5 @@ +.foo { + display: -webkit-box; + display: -ms-flexbox; + display: flex +} diff --git a/node_modules/rucksack-css/test/fixtures/clearfix.css b/node_modules/rucksack-css/test/fixtures/clearfix.css new file mode 100644 index 00000000..4775fc7b --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/clearfix.css @@ -0,0 +1,3 @@ +.foo { + clear: fix; +} diff --git a/node_modules/rucksack-css/test/fixtures/clearfix.expected.css b/node_modules/rucksack-css/test/fixtures/clearfix.expected.css new file mode 100644 index 00000000..0c7831be --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/clearfix.expected.css @@ -0,0 +1,5 @@ +.foo:after { + content: ''; + display: block; + clear: both; +} diff --git a/node_modules/rucksack-css/test/fixtures/easings.css b/node_modules/rucksack-css/test/fixtures/easings.css new file mode 100644 index 00000000..e9a2c1f0 --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/easings.css @@ -0,0 +1,11 @@ +.foo { + transition: all 1s easeInSine; +} + +.bar { + transition: all 1s ease-in-sine; +} + +.baz { + transition: ease-in-sine, easeInOutExpo; +}
\ No newline at end of file diff --git a/node_modules/rucksack-css/test/fixtures/easings.expected.css b/node_modules/rucksack-css/test/fixtures/easings.expected.css new file mode 100644 index 00000000..ca68f6dd --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/easings.expected.css @@ -0,0 +1,11 @@ +.foo { + transition: all 1s cubic-bezier(0.47, 0, 0.745, 0.715); +} + +.bar { + transition: all 1s cubic-bezier(0.47, 0, 0.745, 0.715); +} + +.baz { + transition: cubic-bezier(0.47, 0, 0.745, 0.715), cubic-bezier(1, 0, 0, 1); +}
\ No newline at end of file diff --git a/node_modules/rucksack-css/test/fixtures/fontpath.css b/node_modules/rucksack-css/test/fixtures/fontpath.css new file mode 100644 index 00000000..c8c8b6f5 --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/fontpath.css @@ -0,0 +1,6 @@ +@font-face { + font-family: 'Test'; + font-path: '/path/to/font'; + font-weight: normal; + font-style: normal; +}
\ No newline at end of file diff --git a/node_modules/rucksack-css/test/fixtures/fontpath.expected.css b/node_modules/rucksack-css/test/fixtures/fontpath.expected.css new file mode 100644 index 00000000..e6da7d95 --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/fontpath.expected.css @@ -0,0 +1,10 @@ +@font-face { + font-family: 'Test'; + src: url("/path/to/font.eot") format('embedded-opentype'), + url("/path/to/font.woff2") format('woff2'), + url("/path/to/font.woff") format('woff'), + url("/path/to/font.ttf") format('truetype'), + url("/path/to/font.svg") format('svg'); + font-weight: normal; + font-style: normal; +}
\ No newline at end of file diff --git a/node_modules/rucksack-css/test/fixtures/hexrgba.css b/node_modules/rucksack-css/test/fixtures/hexrgba.css new file mode 100644 index 00000000..34f820b3 --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/hexrgba.css @@ -0,0 +1,4 @@ +.foo { + color: rgba(#ffffff, 0.5); + background: rgba(#00b2ff,.8); +} diff --git a/node_modules/rucksack-css/test/fixtures/hexrgba.expected.css b/node_modules/rucksack-css/test/fixtures/hexrgba.expected.css new file mode 100644 index 00000000..9dfe2dfb --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/hexrgba.expected.css @@ -0,0 +1,4 @@ +.foo { + color: rgba(255,255,255, 0.5); + background: rgba(0,178,255,.8); +} diff --git a/node_modules/rucksack-css/test/fixtures/input.css b/node_modules/rucksack-css/test/fixtures/input.css new file mode 100644 index 00000000..843bdb54 --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/input.css @@ -0,0 +1,6 @@ +input[type="range"]::thumb { + background: #4286be; + width: 16px; + height: 8px; + border-radius: 999px; +} diff --git a/node_modules/rucksack-css/test/fixtures/input.expected.css b/node_modules/rucksack-css/test/fixtures/input.expected.css new file mode 100644 index 00000000..10a37efb --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/input.expected.css @@ -0,0 +1,26 @@ +input[type="range"]::-webkit-slider-thumb { + -webkit-appearance: none; + background: #4286be; + width: 16px; + height: 8px; + border-radius: 999px; +} +input[type="range"]::-moz-range-thumb { + -moz-appearance: none; + background: #4286be; + width: 16px; + height: 8px; + border-radius: 999px; +} +input[type="range"]::-ms-thumb { + background: #4286be; + width: 16px; + height: 8px; + border-radius: 999px; +} +input[type="range"] { + -webkit-appearance: none; +} +input[type="range"]::-moz-focus-outer { + border: 0; +} diff --git a/node_modules/rucksack-css/test/fixtures/laggard.css b/node_modules/rucksack-css/test/fixtures/laggard.css new file mode 100644 index 00000000..eba6d645 --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/laggard.css @@ -0,0 +1,24 @@ +.opacity { + opacity: .5; +} + +.pseudo::after { + display: block; +} + +.rgba { + background: rgba(153, 221, 153, 0.8); + color: rgba(0, 0, 0, .4); +} + +.vmin { + width: 50vmin; +} + +.pixrem { + font-size: 2rem; +} + +.willchange { + will-change: transform; +} diff --git a/node_modules/rucksack-css/test/fixtures/laggard.expected.css b/node_modules/rucksack-css/test/fixtures/laggard.expected.css new file mode 100644 index 00000000..2cee4f69 --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/laggard.expected.css @@ -0,0 +1,30 @@ +.opacity { + -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; + opacity: .5; +} + +.pseudo:after { + display: block; +} + +.rgba { + background: #99dd99; + background: rgba(153, 221, 153, 0.8); + color: #000000; + color: rgba(0, 0, 0, .4); +} + +.vmin { + width: 50vm; + width: 50vmin; +} + +.pixrem { + font-size: 32px; + font-size: 2rem; +} + +.willchange { + backface-visibility: hidden; + will-change: transform; +} diff --git a/node_modules/rucksack-css/test/fixtures/position.css b/node_modules/rucksack-css/test/fixtures/position.css new file mode 100644 index 00000000..a50818d5 --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/position.css @@ -0,0 +1,15 @@ +.foo { + position: absolute 10px 20px 30px 40px; +} + +.bar { + position: fixed 0; +} + +.baz { + position: absolute 30px auto; +} + +.fab { + position: relative 50% 0 20px; +} diff --git a/node_modules/rucksack-css/test/fixtures/position.expected.css b/node_modules/rucksack-css/test/fixtures/position.expected.css new file mode 100644 index 00000000..5f688f32 --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/position.expected.css @@ -0,0 +1,31 @@ +.foo { + position: absolute; + top: 10px; + right: 20px; + bottom: 30px; + left: 40px; +} + +.bar { + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; +} + +.baz { + position: absolute; + top: 30px; + right: auto; + bottom: 30px; + left: auto; +} + +.fab { + position: relative; + top: 50%; + right: 0; + bottom: 20px; + left: 0; +} diff --git a/node_modules/rucksack-css/test/fixtures/quantity.css b/node_modules/rucksack-css/test/fixtures/quantity.css new file mode 100644 index 00000000..66896484 --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/quantity.css @@ -0,0 +1,15 @@ +.foo > li:at-least(4) { + content: 'test'; +} + +.bar > li:at-most(4) { + content: 'test'; +} + +.baz > li:between(4, 6) { + content: 'test'; +} + +.fab > li:exactly(4) { + content: 'test'; +}
\ No newline at end of file diff --git a/node_modules/rucksack-css/test/fixtures/quantity.expected.css b/node_modules/rucksack-css/test/fixtures/quantity.expected.css new file mode 100644 index 00000000..74f37a92 --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/quantity.expected.css @@ -0,0 +1,15 @@ +.foo > li:nth-last-child(n+4), .foo > li:nth-last-child(n+4) ~ li { + content: 'test'; +} + +.bar > li:nth-last-child(-n+4):first-child, .bar > li:nth-last-child(-n+4):first-child ~ li { + content: 'test'; +} + +.baz > li:nth-last-child(n+4):nth-last-child(-n+6):first-child, .baz > li:nth-last-child(n+4):nth-last-child(-n+6):first-child ~ li { + content: 'test'; +} + +.fab > li:nth-last-child(4):first-child, .fab > li:nth-last-child(4):first-child ~ li { + content: 'test'; +}
\ No newline at end of file diff --git a/node_modules/rucksack-css/test/fixtures/responsive-type.css b/node_modules/rucksack-css/test/fixtures/responsive-type.css new file mode 100644 index 00000000..7cd02e31 --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/responsive-type.css @@ -0,0 +1,4 @@ +.foo { + font-size: responsive 10px 30px; + font-range: 300px 900px; +} diff --git a/node_modules/rucksack-css/test/fixtures/responsive-type.expected.css b/node_modules/rucksack-css/test/fixtures/responsive-type.expected.css new file mode 100644 index 00000000..e4569d02 --- /dev/null +++ b/node_modules/rucksack-css/test/fixtures/responsive-type.expected.css @@ -0,0 +1,13 @@ +.foo { + font-size: calc(10px + 20 * ((100vw - 300px) / 600)); +} +@media screen and (min-width: 900px) { + .foo { + font-size: 30px; + } +} +@media screen and (max-width: 300px) { + .foo { + font-size: 10px; + } +} diff --git a/node_modules/rucksack-css/test/test.js b/node_modules/rucksack-css/test/test.js new file mode 100644 index 00000000..e9eca0fc --- /dev/null +++ b/node_modules/rucksack-css/test/test.js @@ -0,0 +1,86 @@ +/* eslint-disable */ + +'use strict'; + +const postcss = require('postcss'); +const expect = require('chai').expect; +const fs = require('fs'); +const path = require('path'); +const spawn = require('child_process').spawn; +const rucksack = require('../'); + +function test(fixture, opts, done) { + let input = fixture + '.css', + expected = fixture + '.expected.css'; + + input = fs.readFileSync(path.join(__dirname, 'fixtures', input), 'utf8'); + expected = fs.readFileSync(path.join(__dirname, 'fixtures', expected), 'utf8'); + + postcss([ rucksack(opts) ]) + .process(input) + .then(result => { + expect(result.css).to.eql(expected); + expect(result.warnings()).to.be.empty; + done(); + }).catch(error => { + done(error); + }); +}; + +function cli(cmd, callback) { + process.chdir(__dirname); + + let ps, + out = '', + err = ''; + + ps = spawn(process.execPath, [ + path.resolve(__dirname, '../bin/cmd.js') + ].concat(cmd)); + + ps.stdout.on('data', buffer => out += buffer); + ps.stderr.on('data', buffer => err += buffer); + ps.on('exit', function(code) { + callback.call(this, err, out, code); + }); +}; + +function cliTest(fixture, args, done) { + let input = fixture + '.css', + expected = fixture + '.expected.css'; + + input = path.join(__dirname, 'fixtures', input); + expected = path.join(__dirname, 'fixtures', expected); + + cli([input, args], (err, out, code) => { + expect(out).to.eql(fs.readFileSync(expected, 'utf8')); + expect(err).to.be.empty; + expect(code).to.eql(0); + done(); + }); +}; + +describe('Rucksack', () => { + + describe('core features', () => { + it('sets aliases', done => test('alias', {}, done)); + it('applies clear:fix', done => test('clearfix', {}, done)); + it('applies easings', done => test('easings', {}, done)); + it('sets font-path', done => test('fontpath', {}, done)); + it('expands rgba(hex,a)', done => test('hexrgba', {}, done)); + it('expands position shorthands', done => test('position', {}, done)); + it('applies quanity queries', done => test('quantity', {}, done)); + it('does responsive type', done => test('responsive-type', {}, done)); + it('adds new input pseudo-elements', done => test('input', {}, done)); + }); + + describe('addons', () => { + it('applies fallbacks', done => test('laggard', { fallbacks: true }, done)); + it('autoprefixes', done => test('autoprefixer', { autoprefixer: true }, done)); + }) + + describe('cli', () => { + it('processes css on the command line', done => cliTest('position', '', done)); + }); + +}); |