diff options
Diffstat (limited to 'spec/frontend/vue_shared/components/color_select_dropdown/color_item_spec.js')
-rw-r--r-- | spec/frontend/vue_shared/components/color_select_dropdown/color_item_spec.js | 35 |
1 files changed, 35 insertions, 0 deletions
diff --git a/spec/frontend/vue_shared/components/color_select_dropdown/color_item_spec.js b/spec/frontend/vue_shared/components/color_select_dropdown/color_item_spec.js new file mode 100644 index 00000000000..fe614f03119 --- /dev/null +++ b/spec/frontend/vue_shared/components/color_select_dropdown/color_item_spec.js @@ -0,0 +1,35 @@ +import { shallowMountExtended } from 'helpers/vue_test_utils_helper'; +import { hexToRgb } from '~/lib/utils/color_utils'; +import ColorItem from '~/vue_shared/components/color_select_dropdown/color_item.vue'; +import { color } from './mock_data'; + +describe('ColorItem', () => { + let wrapper; + + const propsData = color; + + const createComponent = () => { + wrapper = shallowMountExtended(ColorItem, { + propsData, + }); + }; + + const findColorItem = () => wrapper.findByTestId('color-item'); + + beforeEach(() => { + createComponent(); + }); + + afterEach(() => { + wrapper.destroy(); + }); + + it('renders the correct title', () => { + expect(wrapper.text()).toBe(propsData.title); + }); + + it('renders the correct background color for the color item', () => { + const convertedColor = hexToRgb(propsData.color).join(', '); + expect(findColorItem().attributes('style')).toBe(`background-color: rgb(${convertedColor});`); + }); +}); |