@stylexjs/stylex 0.3.0 → 0.4.0

package/lib/native/__tests__/parseTimeValue-test.js

@@ -1,11 +0,0 @@
-"use strict";
-
-var _parseTimeValue = require("../parseTimeValue");
-const WPT_TRANSITION_DELAY_TEST_CASES = [['10.2s', 10200], ['1s', 1000], ['0.1s', 100], ['0.01s', 10], ['0.001s', 1], ['0.009s', 9], ['0s', 0], ['.0s', 0], ['.3s', 300], ['-5s', -5000], ['10200ms', 10200], ['1000ms', 1000], ['100ms', 100], ['10ms', 10], ['9ms', 9], ['1ms', 1], ['0ms', 0], ['-500ms', -500], ['foobar', 0]];
-describe('parseTimeValue', () => {
-  it('parses time values to milliseconds', () => {
-    for (const [timeValue, expectedMilliseconds] of WPT_TRANSITION_DELAY_TEST_CASES) {
-      expect((0, _parseTimeValue.parseTimeValue)(timeValue)).toEqual(expectedMilliseconds);
-    }
-  });
-});

package/lib/native/__tests__/stylex-css-var-test.js

@@ -1,148 +0,0 @@
-"use strict";
-
-var _stylex = require("../stylex");
-const mockOptions = {
-  customProperties: {
-    testVar: 'red',
-    testVar2: 'blue',
-    boxShadowVar1: '5px 5px 5px black',
-    rawNumber: 10,
-    pixelNumber: '10px',
-    emNumber: '10em',
-    refToRawNumber: 'var(--rawNumber)',
-    refToPixelNumber: 'var(--pixelNumber)',
-    refToRefToRawNumber: 'var(--refToRawNumber)'
-  },
-  viewportHeight: 600,
-  viewportWidth: 320
-};
-function resolveColorValue(colorValue) {
-  const styles = _stylex.stylex.create({
-    root: {
-      color: colorValue
-    }
-  });
-  return _stylex.stylex.props.call(mockOptions, styles.root).style.color;
-}
-describe('stylex CSSCustomProperty value test', () => {
-  beforeEach(() => {
-    jest.spyOn(console, 'warn');
-    console.warn.mockImplementation(() => {});
-  });
-  afterEach(() => {
-    console.warn.mockRestore();
-  });
-  test('parses a basic variable correctly', () => {
-    expect(resolveColorValue('var(--testVar)')).toEqual('red');
-  });
-  test('parses kebab case to camel case', () => {
-    expect(resolveColorValue('var(--test-var)')).toEqual('red');
-  });
-  test('parses a variable with a default value', () => {
-    expect(resolveColorValue('var(--testVar, blue)')).toEqual('red');
-    expect(resolveColorValue('var(--notFound, blue)')).toEqual('blue');
-  });
-  test('parses kebab case with a default value', () => {
-    expect(resolveColorValue('var(--test-var, blue)')).toEqual('red');
-    expect(resolveColorValue('var(--not-found, blue)')).toEqual('blue');
-  });
-  test('parses a variable with a default value with spaces', () => {
-    const styles = _stylex.stylex.create({
-      root: {
-        boxShadow: 'var(--boxShadowVar1, 0px 0px 0px black)'
-      }
-    });
-    expect(_stylex.stylex.props.call(mockOptions, styles.root)).toMatchSnapshot();
-  });
-  test('falls back to a default value with spaces', () => {
-    const styles = _stylex.stylex.create({
-      root: {
-        boxShadow: 'var(--boxShadowVarNotFound, 0px 0px 0px black)'
-      }
-    });
-    expect(_stylex.stylex.props.call(mockOptions, styles.root)).toMatchSnapshot();
-  });
-  test('parses and falls back to default value containing a variable', () => {
-    const styles = _stylex.stylex.create({
-      root: {
-        color: 'var(--colorNotFound, var(--testVar2))'
-      }
-    });
-    expect(_stylex.stylex.props.call(mockOptions, styles.root)).toMatchSnapshot();
-  });
-  test('parses and falls back to a default value containing spaces and embedded variables', () => {
-    const styles = _stylex.stylex.create({
-      root: {
-        boxShadow: 'var(--boxShadowVarNotFound, 0px 0px 0px var(--testVar2))'
-      }
-    });
-    expect(_stylex.stylex.props.call(mockOptions, styles.root)).toMatchSnapshot();
-  });
-  test('does not parse malformed vars', () => {
-    expect(resolveColorValue('var(--testUnfinished')).toEqual('var(--testUnfinished');
-    expect(resolveColorValue('var(bad--input)')).toEqual('var(bad--input)');
-    expect(resolveColorValue('--testMulti')).toEqual('--testMulti');
-    expect(resolveColorValue('var ( --testMulti)')).toEqual('var ( --testMulti)');
-  });
-  test('basic value lookup works', () => {
-    const styles = _stylex.stylex.create({
-      root: {
-        borderWidth: 10
-      },
-      withVars: {
-        borderWidth: 'var(--rawNumber)'
-      }
-    });
-    const rootStyle = _stylex.stylex.props.call(mockOptions, styles.root).style;
-    expect(rootStyle.borderWidth).toEqual(10);
-    expect(_stylex.stylex.props.call(mockOptions, styles.withVars).style.borderWidth).toEqual(rootStyle.borderWidth);
-  });
-  test('value lookup with pixel prop conversion', () => {
-    const styles = _stylex.stylex.create({
-      root: {
-        borderWidth: '10px'
-      },
-      withVars: {
-        borderWidth: 'var(--pixelNumber)'
-      }
-    });
-    const rootStyle = _stylex.stylex.props.call(mockOptions, styles.root).style;
-    expect(rootStyle.borderWidth).toEqual(10);
-    expect(_stylex.stylex.props.call(mockOptions, styles.withVars).style.borderWidth).toEqual(rootStyle.borderWidth);
-  });
-  test('value lookup with em prop conversion', () => {
-    const styles = _stylex.stylex.create({
-      root: {
-        fontSize: '10em'
-      },
-      withVars: {
-        fontSize: 'var(--emNumber)'
-      }
-    });
-    const rootStyle = _stylex.stylex.props.call(mockOptions, styles.root).style;
-    expect(rootStyle.fontSize).toEqual(160);
-    expect(_stylex.stylex.props.call(mockOptions, styles.withVars).style.fontSize).toEqual(rootStyle.fontSize);
-  });
-  test('prop lookup with ref', () => {
-    const styles = _stylex.stylex.create({
-      root: {
-        borderWidth: 'var(--refToRawNumber)'
-      },
-      withVars: {
-        borderWidth: 'var(--refToPixelNumber)'
-      }
-    });
-    const rootStyle = _stylex.stylex.props.call(mockOptions, styles.root).style;
-    expect(rootStyle.borderWidth).toEqual(10);
-    expect(_stylex.stylex.props.call(mockOptions, styles.withVars).style.borderWidth).toEqual(rootStyle.borderWidth);
-  });
-  test('prop lookup with ref to ref', () => {
-    const styles = _stylex.stylex.create({
-      root: {
-        borderWidth: 'var(--refToRefToRawNumber)'
-      }
-    });
-    const rootStyle = _stylex.stylex.props.call(mockOptions, styles.root).style;
-    expect(rootStyle.borderWidth).toEqual(10);
-  });
-});