From 7019c4a38657cf13088405091f9cc5f71a7530c1 Mon Sep 17 00:00:00 2001 From: Brian Hough Date: Fri, 15 May 2020 10:25:39 -0400 Subject: [PATCH] fix(between): added error case when to/from unit is differs from mix/max (#511) * chore(library): update dependencies Update dependencies and fix new flow error in triangle.test.js * refactor(stripunit): fully deprecate returnUnit Fully deprecate returnUnit functionality and refactor return. * refactor(readablecolor): make strict mode default Make strict mode default when passing custom colors. * build(babel): enable bugfix: true Enable bugfix:true in build and target explicit browser list * build(lint-staged): remove superfulous git add * build(lerna): lerna init * feat(normalize): upgrade to normalize 8.0.1 * build(docs): removed documentation.js auto generation * feat(fontface): now defaults to looking for local font first Default is now to look for a local font of the same family-name before downloading. Can be turned off by passing null to localFonts. BREAKING CHANGE: localFont will now be populated by default and may have unexpected behavior. * feat(important): important helper for module rule specificity important helper for targeting specific rules in module returns for adding `!important`-level specificity. * chore(important): update to not mutate original parameter * chore(important): add to index.js * fix(triangle): triangle now properly supports inherit triangle now returns properties in a way that allows inherit to work by declaring an individual side for the triangle color. * feat(cssvar): allow a default value for cssVar Allow the user to pass a default value to cssVar for when a variable is not found. * fix(between): added error case when to/from unit is different than min/max Added an error case when the unit for to/fromSize is different than min/maxScreen. This was causing bad calculations based on the differing scales. BREAKING CHANGE: If you were using a mix of unit and unitless measure or working with different units with similar scales (em/rem) you will now get an error where you may have been getting a seemingly valid calculation. fix #445 --- src/internalHelpers/errors.md | 4 +++ src/mixins/between.js | 4 +++ .../test/__snapshots__/between.test.js.snap | 4 --- src/mixins/test/between.test.js | 25 +++++++++++++------ 4 files changed, 26 insertions(+), 11 deletions(-) diff --git a/src/internalHelpers/errors.md b/src/internalHelpers/errors.md index 86137541..08f6f104 100644 --- a/src/internalHelpers/errors.md +++ b/src/internalHelpers/errors.md @@ -302,3 +302,7 @@ CSS variable not found and no default was provided. ## 75 important requires a valid style object, got a %s instead. + +## 76 + +fromSize and toSize must be provided as stringified numbers with the same units as minScreen and maxScreen. diff --git a/src/mixins/between.js b/src/mixins/between.js index c3597e50..abbf27c7 100644 --- a/src/mixins/between.js +++ b/src/mixins/between.js @@ -54,6 +54,10 @@ export default function between( throw new PolishedError(48) } + if (fromSizeUnit !== minScreenUnit || toSizeUnit !== maxScreenUnit) { + throw new PolishedError(76) + } + const slope = (unitlessFromSize - unitlessToSize) / (unitlessMinScreen - unitlessMaxScreen) const base = unitlessToSize - slope * unitlessMaxScreen diff --git a/src/mixins/test/__snapshots__/between.test.js.snap b/src/mixins/test/__snapshots__/between.test.js.snap index 6752db14..b7574a31 100644 --- a/src/mixins/test/__snapshots__/between.test.js.snap +++ b/src/mixins/test/__snapshots__/between.test.js.snap @@ -3,7 +3,3 @@ exports[`between should return a valid calc formula when not passed min/max screen sizes 1`] = `"calc(-9.09px + 9.09vw)"`; exports[`between should return a valid calc formula when passed min/max screen sizes 1`] = `"calc(-33.33px + 13.33vw)"`; - -exports[`between should return a valid calc formula when passed unitless to/from values as numbers 1`] = `"calc(-9.09 + 9.09vw)"`; - -exports[`between should return a valid calc formula when passed unitless to/from values as strings 1`] = `"calc(-9.09 + 9.09vw)"`; diff --git a/src/mixins/test/between.test.js b/src/mixins/test/between.test.js index 6458314b..ee532034 100644 --- a/src/mixins/test/between.test.js +++ b/src/mixins/test/between.test.js @@ -10,13 +10,6 @@ describe('between', () => { expect(between('20px', '100px')).toMatchSnapshot() }) - it('should return a valid calc formula when passed unitless to/from values as numbers', () => { - expect(between(20, 100)).toMatchSnapshot() - }) - - it('should return a valid calc formula when passed unitless to/from values as strings', () => { - expect(between('20', '100')).toMatchSnapshot() - }) // Errors it('should throw an error when not passed min/max screen size as a string', () => { expect(() => { @@ -44,4 +37,22 @@ describe('between', () => { 'fromSize and toSize must be provided as stringified numbers with the same units.', ) }) + + it('should throw an error when passed to/from size with different units than mix/max screen', () => { + expect(() => { + // $FlowFixMe + between('1em', '100em', '400px', '1000px') + }).toThrow( + 'fromSize and toSize must be provided as stringified numbers with the same units as minScreen and maxScreen.', + ) + }) + + it('should throw an error when passed to/from size with no units but mix/max with units', () => { + expect(() => { + // $FlowFixMe + between(20, 100) + }).toThrow( + 'fromSize and toSize must be provided as stringified numbers with the same units as minScreen and maxScreen.', + ) + }) })