[getContrastText] Throw descriptive exception when passing falsy argu…

…ment
mui · Nov 15, 2019 · 636b203 · 636b203
1 parent a54729e
commit 636b203
Show file tree

Hide file tree

Showing 2 changed files with 38 additions and 10 deletions.
diff --git a/packages/material-ui/src/styles/createPalette.js b/packages/material-ui/src/styles/createPalette.js
@@ -104,12 +104,10 @@ export default function createPalette(palette) {
   // Bootstrap: https://github.com/twbs/bootstrap/blob/1d6e3710dd447de1a200f29e8fa521f8a0908f70/scss/_functions.scss#L59
   // and material-components-web https://github.com/material-components/material-components-web/blob/ac46b8863c4dab9fc22c4c662dc6bd1b65dd652f/packages/mdc-theme/_functions.scss#L54
   function getContrastText(background) {
-    if (process.env.NODE_ENV !== 'production') {
-      if (!background) {
-        console.error(
-          `Material-UI: missing background argument in getContrastText(${background}).`,
-        );
-      }
+    if (!background) {
+      throw new TypeError(
+        `Material-UI: missing background argument in getContrastText(${background}).`,
+      );
     }
 
     const contrastText =

diff --git a/packages/material-ui/src/styles/createPalette.test.js b/packages/material-ui/src/styles/createPalette.test.js
@@ -5,11 +5,11 @@ import { darken, lighten } from './colorManipulator';
 import createPalette, { dark, light } from './createPalette';
 
 describe('createPalette()', () => {
-  before(() => {
+  beforeEach(() => {
     consoleErrorMock.spy();
   });
 
-  after(() => {
+  afterEach(() => {
     consoleErrorMock.reset();
   });
 
@@ -361,15 +361,14 @@ describe('createPalette()', () => {
     assert.strictEqual(consoleErrorMock.callCount(), 0);
   });
 
-  it('should throw an exception when an invalid type is specified', () => {
+  it('logs an error when an invalid type is specified', () => {
     createPalette({ type: 'foo' });
     assert.strictEqual(consoleErrorMock.callCount(), 1);
     assert.match(
       consoleErrorMock.args()[0][0],
       /Material-UI: the palette type `foo` is not supported/,
     );
   });
-
   describe('augmentColor', () => {
     const palette = createPalette({});
 
@@ -433,6 +432,37 @@ describe('createPalette()', () => {
     });
   });
 
+  describe('getContrastText', () => {
+    it('throws an exception with a falsy argument', () => {
+      const { getContrastText } = createPalette({});
+
+      [
+        [undefined, 'missing background argument in getContrastText(undefined)'],
+        [null, 'missing background argument in getContrastText(null)'],
+        ['', 'missing background argument in getContrastText()'],
+        [0, 'missing background argument in getContrastText(0)'],
+      ].forEach(testEntry => {
+        const [argument, errorMessage] = testEntry;
+
+        assert.throws(() => getContrastText(argument), errorMessage);
+      });
+    });
+
+    it('logs an error when the contrast ratio does not reach AA', () => {
+      const { getContrastText } = createPalette({
+        contrastThreshold: 0,
+      });
+
+      getContrastText('#fefefe');
+
+      assert.strictEqual(consoleErrorMock.callCount(), 1);
+      assert.include(
+        consoleErrorMock.args()[0][0],
+        'falls below the WACG recommended absolute minimum contrast ratio of 3:1',
+      );
+    });
+  });
+
   it('should create a palette with unique object references', () => {
     const redPalette = createPalette({ background: { paper: 'red' } });
     const bluePalette = createPalette({ background: { paper: 'blue' } });