From 98ea1bcd1f33c039dcdab6ee671d1ab6140ce774 Mon Sep 17 00:00:00 2001 From: Martijn Cuppens Date: Sat, 29 Dec 2018 01:22:16 +0100 Subject: More mocha tests (#62) --- test/less/test-10.less | 10 ++++++++++ test/less/test-5.less | 2 ++ test/less/test-6.less | 2 ++ test/less/test-7.less | 2 ++ test/less/test-8.less | 2 ++ test/less/test-9.less | 9 +++++++++ test/lib/tests.js | 24 +++++++++++++++++++++++ test/postcss/tests.js | 32 +++++++++++++++++++++++++++++++ test/result/test-10.css | 50 ++++++++++++++++++++++++++++++++++++++++++++++++ test/result/test-5.css | 44 ++++++++++++++++++++++++++++++++++++++++++ test/result/test-6.css | 44 ++++++++++++++++++++++++++++++++++++++++++ test/result/test-7.css | 44 ++++++++++++++++++++++++++++++++++++++++++ test/result/test-8.css | 44 ++++++++++++++++++++++++++++++++++++++++++ test/result/test-9.css | 50 ++++++++++++++++++++++++++++++++++++++++++++++++ test/sass/test-10.scss | 10 ++++++++++ test/sass/test-5.scss | 2 ++ test/sass/test-6.scss | 2 ++ test/sass/test-7.scss | 2 ++ test/sass/test-8.scss | 2 ++ test/sass/test-9.scss | 9 +++++++++ test/stylus/test-10.styl | 10 ++++++++++ test/stylus/test-5.styl | 2 ++ test/stylus/test-6.styl | 2 ++ test/stylus/test-7.styl | 2 ++ test/stylus/test-8.styl | 2 ++ test/stylus/test-9.styl | 9 +++++++++ 26 files changed, 413 insertions(+) create mode 100644 test/less/test-10.less create mode 100644 test/less/test-5.less create mode 100644 test/less/test-6.less create mode 100644 test/less/test-7.less create mode 100644 test/less/test-8.less create mode 100644 test/less/test-9.less create mode 100644 test/result/test-10.css create mode 100644 test/result/test-5.css create mode 100644 test/result/test-6.css create mode 100644 test/result/test-7.css create mode 100644 test/result/test-8.css create mode 100644 test/result/test-9.css create mode 100644 test/sass/test-10.scss create mode 100644 test/sass/test-5.scss create mode 100644 test/sass/test-6.scss create mode 100644 test/sass/test-7.scss create mode 100644 test/sass/test-8.scss create mode 100644 test/sass/test-9.scss create mode 100644 test/stylus/test-10.styl create mode 100644 test/stylus/test-5.styl create mode 100644 test/stylus/test-6.styl create mode 100644 test/stylus/test-7.styl create mode 100644 test/stylus/test-8.styl create mode 100644 test/stylus/test-9.styl (limited to 'test') diff --git a/test/less/test-10.less b/test/less/test-10.less new file mode 100644 index 0000000..5f93344 --- /dev/null +++ b/test/less/test-10.less @@ -0,0 +1,10 @@ +@import "../../less/rfs"; +@import "main"; +@rfs-base-font-size: 12px; +@rfs-font-size-unit: px; +@rfs-breakpoint: 800; +@rfs-breakpoint-unit: rem; +@rfs-two-dimensional: true; +@rfs-factor: 5; +@rfs-class: true; +@rfs-safari-iframe-resize-bug-fix: true; diff --git a/test/less/test-5.less b/test/less/test-5.less new file mode 100644 index 0000000..3ba02b6 --- /dev/null +++ b/test/less/test-5.less @@ -0,0 +1,2 @@ +@import "main"; +@rfs-breakpoint-unit: em; diff --git a/test/less/test-6.less b/test/less/test-6.less new file mode 100644 index 0000000..93fe09e --- /dev/null +++ b/test/less/test-6.less @@ -0,0 +1,2 @@ +@import "main"; +@rfs-base-font-size: 17px; diff --git a/test/less/test-7.less b/test/less/test-7.less new file mode 100644 index 0000000..0d712c8 --- /dev/null +++ b/test/less/test-7.less @@ -0,0 +1,2 @@ +@import "main"; +@rfs-font-size-unit: px; diff --git a/test/less/test-8.less b/test/less/test-8.less new file mode 100644 index 0000000..1a9c660 --- /dev/null +++ b/test/less/test-8.less @@ -0,0 +1,2 @@ +@import "main"; +@rfs-two-dimensional: true; diff --git a/test/less/test-9.less b/test/less/test-9.less new file mode 100644 index 0000000..e8d7c36 --- /dev/null +++ b/test/less/test-9.less @@ -0,0 +1,9 @@ +@import "main"; +@rfs-base-font-size: 12px; +@rfs-font-size-unit: px; +@rfs-breakpoint: 800; +@rfs-breakpoint-unit: rem; +@rfs-two-dimensional: true; +@rfs-factor: 5; +@rfs-class: true; +@rfs-safari-iframe-resize-bug-fix: true; diff --git a/test/lib/tests.js b/test/lib/tests.js index 38120ba..b5170f1 100644 --- a/test/lib/tests.js +++ b/test/lib/tests.js @@ -15,4 +15,28 @@ module.exports = [ id: 'test-4', name: 'Enable class' }, + { + id: 'test-5', + name: 'Change breakpoint unit to em' + }, + { + id: 'test-6', + name: 'Change base font size' + }, + { + id: 'test-7', + name: 'Change font size unit' + }, + { + id: 'test-8', + name: 'Enable two dimensional' + }, + { + id: 'test-9', + name: 'Go loco with the config' + }, + { + id: 'test-10', + name: 'Include mixins multiple times (Should throw a warning for SCSS & Stylus and not fail for less & PostCSS)' + }, ]; diff --git a/test/postcss/tests.js b/test/postcss/tests.js index 6de7d8b..37fb0dd 100644 --- a/test/postcss/tests.js +++ b/test/postcss/tests.js @@ -8,5 +8,37 @@ module.exports = { }, 'test-4': { class: 'enable' + }, + 'test-5': { + breakpointUnit: 'em' + }, + 'test-6': { + baseFontSize: '17px' + }, + 'test-7': { + fontSizeUnit: 'px' + }, + 'test-8': { + twoDimensional: true + }, + 'test-9': { + baseFontSize: '12px', + fontSizeUnit: 'px', + breakpoint: 800, + breakpointUnit: 'rem', + twoDimensional: true, + factor: 5, + class: true, + safariIframeResizeBugFix: true, + }, + 'test-10': { // Not testable + baseFontSize: '12px', + fontSizeUnit: 'px', + breakpoint: 800, + breakpointUnit: 'rem', + twoDimensional: true, + factor: 5, + class: true, + safariIframeResizeBugFix: true, } }; diff --git a/test/result/test-10.css b/test/result/test-10.css new file mode 100644 index 0000000..c84a744 --- /dev/null +++ b/test/result/test-10.css @@ -0,0 +1,50 @@ +.selector-1 { + background-color: #f00; + width: 300px; + font-size: 32px; } + @media (max-width: 50rem), (max-height: 50rem) { + .selector-1 { + font-size: calc(16px + 2vmin) ; + min-width: 0vw; } } + +.selector-2 { + font-size: 32px; } + @media (max-width: 50rem), (max-height: 50rem) { + .selector-2 { + font-size: calc(16px + 2vmin) ; + min-width: 0vw; } } + +.selector-3 { + font-size: 32px !important; } + @media (max-width: 50rem), (max-height: 50rem) { + .selector-3 { + font-size: calc(16px + 2vmin) !important; + min-width: 0vw; } } + +.selector-4 { + font-size: 32px; } + @media (max-width: 50rem), (max-height: 50rem) { + .selector-4 { + font-size: calc(16px + 2vmin) ; + min-width: 0vw; } } + +.selector-5 { + font-size: 2em; } + +.selector-6 { + font-size: inherit; } + +@supports (display: flex) { + .selector-7 { + font-size: 28px; } + @media (max-width: 50rem), (max-height: 50rem) { + .selector-7 { + font-size: calc(15.2px + 1.6vmin) ; + min-width: 0vw; } } } + +.selector-8 { + font-size: 32px; } + @media (max-width: 50rem), (max-height: 50rem) { + .selector-8 { + font-size: calc(16px + 2vmin) ; + min-width: 0vw; } } diff --git a/test/result/test-5.css b/test/result/test-5.css new file mode 100644 index 0000000..461b32b --- /dev/null +++ b/test/result/test-5.css @@ -0,0 +1,44 @@ +.selector-1 { + background-color: #f00; + width: 300px; + font-size: 2rem; } + @media (max-width: 75em) { + .selector-1 { + font-size: calc(1.325rem + 0.9vw) ; } } + +.selector-2 { + font-size: 2rem; } + @media (max-width: 75em) { + .selector-2 { + font-size: calc(1.325rem + 0.9vw) ; } } + +.selector-3 { + font-size: 2rem !important; } + @media (max-width: 75em) { + .selector-3 { + font-size: calc(1.325rem + 0.9vw) !important; } } + +.selector-4 { + font-size: 2rem; } + @media (max-width: 75em) { + .selector-4 { + font-size: calc(1.325rem + 0.9vw) ; } } + +.selector-5 { + font-size: 2em; } + +.selector-6 { + font-size: inherit; } + +@supports (display: flex) { + .selector-7 { + font-size: 1.75rem; } + @media (max-width: 75em) { + .selector-7 { + font-size: calc(1.3rem + 0.6vw) ; } } } + +.selector-8 { + font-size: 2rem; } + @media (max-width: 75em) { + .selector-8 { + font-size: calc(1.325rem + 0.9vw) ; } } diff --git a/test/result/test-6.css b/test/result/test-6.css new file mode 100644 index 0000000..d4330c1 --- /dev/null +++ b/test/result/test-6.css @@ -0,0 +1,44 @@ +.selector-1 { + background-color: #f00; + width: 300px; + font-size: 2rem; } + @media (max-width: 1200px) { + .selector-1 { + font-size: calc(1.15625rem + 1.125vw) ; } } + +.selector-2 { + font-size: 2rem; } + @media (max-width: 1200px) { + .selector-2 { + font-size: calc(1.15625rem + 1.125vw) ; } } + +.selector-3 { + font-size: 2rem !important; } + @media (max-width: 1200px) { + .selector-3 { + font-size: calc(1.15625rem + 1.125vw) !important; } } + +.selector-4 { + font-size: 2rem; } + @media (max-width: 1200px) { + .selector-4 { + font-size: calc(1.15625rem + 1.125vw) ; } } + +.selector-5 { + font-size: 2em; } + +.selector-6 { + font-size: inherit; } + +@supports (display: flex) { + .selector-7 { + font-size: 1.75rem; } + @media (max-width: 1200px) { + .selector-7 { + font-size: calc(1.13125rem + 0.825vw) ; } } } + +.selector-8 { + font-size: 2rem; } + @media (max-width: 1200px) { + .selector-8 { + font-size: calc(1.15625rem + 1.125vw) ; } } diff --git a/test/result/test-7.css b/test/result/test-7.css new file mode 100644 index 0000000..ae43db2 --- /dev/null +++ b/test/result/test-7.css @@ -0,0 +1,44 @@ +.selector-1 { + background-color: #f00; + width: 300px; + font-size: 32px; } + @media (max-width: 1200px) { + .selector-1 { + font-size: calc(21.2px + 0.9vw) ; } } + +.selector-2 { + font-size: 32px; } + @media (max-width: 1200px) { + .selector-2 { + font-size: calc(21.2px + 0.9vw) ; } } + +.selector-3 { + font-size: 32px !important; } + @media (max-width: 1200px) { + .selector-3 { + font-size: calc(21.2px + 0.9vw) !important; } } + +.selector-4 { + font-size: 32px; } + @media (max-width: 1200px) { + .selector-4 { + font-size: calc(21.2px + 0.9vw) ; } } + +.selector-5 { + font-size: 2em; } + +.selector-6 { + font-size: inherit; } + +@supports (display: flex) { + .selector-7 { + font-size: 28px; } + @media (max-width: 1200px) { + .selector-7 { + font-size: calc(20.8px + 0.6vw) ; } } } + +.selector-8 { + font-size: 32px; } + @media (max-width: 1200px) { + .selector-8 { + font-size: calc(21.2px + 0.9vw) ; } } diff --git a/test/result/test-8.css b/test/result/test-8.css new file mode 100644 index 0000000..910e037 --- /dev/null +++ b/test/result/test-8.css @@ -0,0 +1,44 @@ +.selector-1 { + background-color: #f00; + width: 300px; + font-size: 2rem; } + @media (max-width: 1200px), (max-height: 1200px) { + .selector-1 { + font-size: calc(1.325rem + 0.9vmin) ; } } + +.selector-2 { + font-size: 2rem; } + @media (max-width: 1200px), (max-height: 1200px) { + .selector-2 { + font-size: calc(1.325rem + 0.9vmin) ; } } + +.selector-3 { + font-size: 2rem !important; } + @media (max-width: 1200px), (max-height: 1200px) { + .selector-3 { + font-size: calc(1.325rem + 0.9vmin) !important; } } + +.selector-4 { + font-size: 2rem; } + @media (max-width: 1200px), (max-height: 1200px) { + .selector-4 { + font-size: calc(1.325rem + 0.9vmin) ; } } + +.selector-5 { + font-size: 2em; } + +.selector-6 { + font-size: inherit; } + +@supports (display: flex) { + .selector-7 { + font-size: 1.75rem; } + @media (max-width: 1200px), (max-height: 1200px) { + .selector-7 { + font-size: calc(1.3rem + 0.6vmin) ; } } } + +.selector-8 { + font-size: 2rem; } + @media (max-width: 1200px), (max-height: 1200px) { + .selector-8 { + font-size: calc(1.325rem + 0.9vmin) ; } } diff --git a/test/result/test-9.css b/test/result/test-9.css new file mode 100644 index 0000000..c84a744 --- /dev/null +++ b/test/result/test-9.css @@ -0,0 +1,50 @@ +.selector-1 { + background-color: #f00; + width: 300px; + font-size: 32px; } + @media (max-width: 50rem), (max-height: 50rem) { + .selector-1 { + font-size: calc(16px + 2vmin) ; + min-width: 0vw; } } + +.selector-2 { + font-size: 32px; } + @media (max-width: 50rem), (max-height: 50rem) { + .selector-2 { + font-size: calc(16px + 2vmin) ; + min-width: 0vw; } } + +.selector-3 { + font-size: 32px !important; } + @media (max-width: 50rem), (max-height: 50rem) { + .selector-3 { + font-size: calc(16px + 2vmin) !important; + min-width: 0vw; } } + +.selector-4 { + font-size: 32px; } + @media (max-width: 50rem), (max-height: 50rem) { + .selector-4 { + font-size: calc(16px + 2vmin) ; + min-width: 0vw; } } + +.selector-5 { + font-size: 2em; } + +.selector-6 { + font-size: inherit; } + +@supports (display: flex) { + .selector-7 { + font-size: 28px; } + @media (max-width: 50rem), (max-height: 50rem) { + .selector-7 { + font-size: calc(15.2px + 1.6vmin) ; + min-width: 0vw; } } } + +.selector-8 { + font-size: 32px; } + @media (max-width: 50rem), (max-height: 50rem) { + .selector-8 { + font-size: calc(16px + 2vmin) ; + min-width: 0vw; } } diff --git a/test/sass/test-10.scss b/test/sass/test-10.scss new file mode 100644 index 0000000..a788bb7 --- /dev/null +++ b/test/sass/test-10.scss @@ -0,0 +1,10 @@ +$rfs-base-font-size: 12px; +$rfs-font-size-unit: px; +$rfs-breakpoint: 800; +$rfs-breakpoint-unit: rem; +$rfs-two-dimensional: true; +$rfs-factor: 5; +$rfs-class: true; +$rfs-safari-iframe-resize-bug-fix: true; +@import "../../sass/rfs"; +@import "main"; diff --git a/test/sass/test-5.scss b/test/sass/test-5.scss new file mode 100644 index 0000000..ab8d882 --- /dev/null +++ b/test/sass/test-5.scss @@ -0,0 +1,2 @@ +$rfs-breakpoint-unit: em; +@import "main"; diff --git a/test/sass/test-6.scss b/test/sass/test-6.scss new file mode 100644 index 0000000..926213e --- /dev/null +++ b/test/sass/test-6.scss @@ -0,0 +1,2 @@ +$rfs-base-font-size: 17px; +@import "main"; diff --git a/test/sass/test-7.scss b/test/sass/test-7.scss new file mode 100644 index 0000000..ceace3a --- /dev/null +++ b/test/sass/test-7.scss @@ -0,0 +1,2 @@ +$rfs-font-size-unit: px; +@import "main"; diff --git a/test/sass/test-8.scss b/test/sass/test-8.scss new file mode 100644 index 0000000..145fa0e --- /dev/null +++ b/test/sass/test-8.scss @@ -0,0 +1,2 @@ +$rfs-two-dimensional: true; +@import "main"; diff --git a/test/sass/test-9.scss b/test/sass/test-9.scss new file mode 100644 index 0000000..84f6f73 --- /dev/null +++ b/test/sass/test-9.scss @@ -0,0 +1,9 @@ +$rfs-base-font-size: 12px; +$rfs-font-size-unit: px; +$rfs-breakpoint: 800; +$rfs-breakpoint-unit: rem; +$rfs-two-dimensional: true; +$rfs-factor: 5; +$rfs-class: true; +$rfs-safari-iframe-resize-bug-fix: true; +@import "main"; diff --git a/test/stylus/test-10.styl b/test/stylus/test-10.styl new file mode 100644 index 0000000..10b84d8 --- /dev/null +++ b/test/stylus/test-10.styl @@ -0,0 +1,10 @@ +$rfs-base-font-size = 12px +$rfs-font-size-unit = px +$rfs-breakpoint = 800 +$rfs-breakpoint-unit = rem +$rfs-two-dimensional = true +$rfs-factor = 5 +$rfs-class = true +$rfs-safari-iframe-resize-bug-fix = true +@import "../../stylus/rfs"; +@import "main" diff --git a/test/stylus/test-5.styl b/test/stylus/test-5.styl new file mode 100644 index 0000000..578f328 --- /dev/null +++ b/test/stylus/test-5.styl @@ -0,0 +1,2 @@ +$rfs-breakpoint-unit = em +@import "main"; diff --git a/test/stylus/test-6.styl b/test/stylus/test-6.styl new file mode 100644 index 0000000..f3df4b1 --- /dev/null +++ b/test/stylus/test-6.styl @@ -0,0 +1,2 @@ +$rfs-base-font-size = 17px +@import "main"; diff --git a/test/stylus/test-7.styl b/test/stylus/test-7.styl new file mode 100644 index 0000000..fce5ecd --- /dev/null +++ b/test/stylus/test-7.styl @@ -0,0 +1,2 @@ +$rfs-font-size-unit = px +@import "main"; diff --git a/test/stylus/test-8.styl b/test/stylus/test-8.styl new file mode 100644 index 0000000..cc9f178 --- /dev/null +++ b/test/stylus/test-8.styl @@ -0,0 +1,2 @@ +$rfs-two-dimensional = true +@import "main"; diff --git a/test/stylus/test-9.styl b/test/stylus/test-9.styl new file mode 100644 index 0000000..a860640 --- /dev/null +++ b/test/stylus/test-9.styl @@ -0,0 +1,9 @@ +$rfs-base-font-size = 12px +$rfs-font-size-unit = px +$rfs-breakpoint = 800 +$rfs-breakpoint-unit = rem +$rfs-two-dimensional = true +$rfs-factor = 5 +$rfs-class = true +$rfs-safari-iframe-resize-bug-fix = true +@import "main" -- cgit v1.2.3