import transformCss from '..'

it('transforms flex shorthand with 3 values', () => {
  expect(transformCss([['flex', '1 2 3px']])).toEqual({
    flexGrow: 1,
    flexShrink: 2,
    flexBasis: 3,
  })
})

it('transforms flex shorthand with 3 values in reverse order', () => {
  expect(transformCss([['flex', '3px 1 2']])).toEqual({
    flexGrow: 1,
    flexShrink: 2,
    flexBasis: 3,
  })
})

it('transforms flex shorthand with 2 values of flex-grow and flex-shrink', () => {
  expect(transformCss([['flex', '1 2']])).toEqual({
    flexGrow: 1,
    flexShrink: 2,
    flexBasis: 0,
  })
})

it('transforms flex shorthand with 2 values of flex-grow and flex-basis', () => {
  expect(transformCss([['flex', '2 2px']])).toEqual({
    flexGrow: 2,
    flexShrink: 1,
    flexBasis: 2,
  })
})

it('transforms flex shorthand with 2 values of flex-grow and flex-basis (reversed)', () => {
  expect(transformCss([['flex', '2px 2']])).toEqual({
    flexGrow: 2,
    flexShrink: 1,
    flexBasis: 2,
  })
})

it('transforms flex shorthand with 1 value of flex-grow', () => {
  expect(transformCss([['flex', '2']])).toEqual({
    flexGrow: 2,
    flexShrink: 1,
    flexBasis: 0,
  })
})

it('transforms flex shorthand with 1 value of flex-basis', () => {
  expect(transformCss([['flex', '10px']])).toEqual({
    flexGrow: 1,
    flexShrink: 1,
    flexBasis: 10,
  })
})

/*
A unitless zero that is not already preceded by two flex factors must be interpreted as a flex
factor. To avoid misinterpretation or invalid declarations, authors must specify a zero
<‘flex-basis’> component with a unit or precede it by two flex factors.
*/
it('transforms flex shorthand with flex-grow/shrink taking priority over basis', () => {
  expect(transformCss([['flex', '0 1 0']])).toEqual({
    flexGrow: 0,
    flexShrink: 1,
    flexBasis: 0,
  })
})

it('transforms flex shorthand with flex-basis set to auto', () => {
  expect(transformCss([['flex', '0 1 auto']])).toEqual({
    flexGrow: 0,
    flexShrink: 1,
    flexBasis: 'auto',
  })
})

it('transforms flex shorthand with flex-basis set to percent', () => {
  expect(transformCss([['flex', '1 2 30%']])).toEqual({
    flexGrow: 1,
    flexShrink: 2,
    flexBasis: '30%',
  })
})

it('transforms flex shorthand with flex-basis set to unsupported unit', () => {
  expect(transformCss([['flex', '1 2 30em']])).toEqual({
    flexGrow: 1,
    flexShrink: 2,
    flexBasis: '30em',
  })
})

it('transforms flex shorthand with flex-basis set to auto appearing first', () => {
  expect(transformCss([['flex', 'auto 0 1']])).toEqual({
    flexGrow: 0,
    flexShrink: 1,
    flexBasis: 'auto',
  })
})

it('transforms flex auto keyword', () => {
  expect(transformCss([['flex', 'auto']])).toEqual({
    flexGrow: 1,
    flexShrink: 1,
    flexBasis: 'auto',
  })
})

it('transforms flex none keyword', () => {
  expect(transformCss([['flex', 'none']])).toEqual({
    flexGrow: 0,
    flexShrink: 0,
    flexBasis: 'auto',
  })
})

it('does not transform invalid flex', () => {
  expect(() => transformCss([['flex', '1 2px 3']])).toThrow()
})