apphouse/dist/styles/getGradientBoxShadow.test.ts

Component library for React that uses observable state management and theme-able components.

import { getGradientBoxShadow } from './getGradientBoxShadow';

describe('getBoxShadow', () => {
  it('should return correct box shadow for less than 7 colors', () => {
    const colors = ['red', 'blue', 'green'];
    const expectedBoxShadow =
      '-10px -10px 10px red, 0px -10px 10px 0px blue, 10px -10px 10px green, 10px 0 10px red, 10px 10px 10px 0px blue, 0 10px 10px 0px green, -10px 10px 10px 0px red';
    expect(getGradientBoxShadow(colors)).toEqual(expectedBoxShadow);
  });

  it('should return correct box shadow for more than 7 colors', () => {
    const colors = [
      'red',
      'blue',
      'green',
      'yellow',
      'orange',
      'purple',
      'pink',
      'brown'
    ];
    const expectedBoxShadow =
      '-10px -10px 10px red, 0px -10px 10px 0px blue, 10px -10px 10px green, 10px 0 10px yellow, 10px 10px 10px 0px orange, 0 10px 10px 0px purple, -10px 10px 10px 0px pink';
    expect(getGradientBoxShadow(colors)).toEqual(expectedBoxShadow);
  });

  it('should return correct box shadow for exactly 7 colors', () => {
    const colors = [
      'red',
      'blue',
      'green',
      'yellow',
      'orange',
      'purple',
      'pink'
    ];
    const expectedBoxShadow =
      '-10px -10px 10px red, 0px -10px 10px 0px blue, 10px -10px 10px green, 10px 0 10px yellow, 10px 10px 10px 0px orange, 0 10px 10px 0px purple, -10px 10px 10px 0px pink';
    expect(getGradientBoxShadow(colors)).toEqual(expectedBoxShadow);
  });
});