File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
import { describe, beforeEach, it, expect } from '@jest/globals'
import { mount } from '@vue/test-utils'
import VueIcon from './../lib/svg-icon.vue'
const path = 'M 10 10 H 90 V 90 H 10 L 10 10'
describe('Vue icon', () => {
let component
beforeEach(() => {
component = mount(VueIcon, {
propsData: {
path,
},
})
})
it("accepts a 'type' property", async () => {
await component.setProps({ path, type: 'mdi' })
expect(component.attributes().height).toBe('24')
expect(component.attributes().width).toBe('24')
expect(component.attributes().viewBox).toBe('0 0 24 24')
})
it('renders an svg with path element', () => {
expect(component.html()).toContain('svg')
expect(component.find('path').attributes('d')).toBe(path)
})
it("accepts a 'size' property", async () => {
await component.setProps({ path, size: 2 })
expect(component.attributes().height).toBe('2')
expect(component.attributes().width).toBe('2')
})
it("accepts a 'viewbox' property", async () => {
await component.setProps({ path, viewbox: '0 0 30 30' })
expect(component.attributes().viewBox).toBe('0 0 30 30')
})
it("accepts a 'flip' property", async () => {
await component.setProps({ path, flip: 'none' })
expect(getComputedStyle(component.element).getPropertyValue('--sx')).toBe('1')
expect(getComputedStyle(component.element).getPropertyValue('--sy')).toBe('1')
await component.setProps({ path, flip: 'both' })
expect(getComputedStyle(component.element).getPropertyValue('--sx')).toBe('-1')
expect(getComputedStyle(component.element).getPropertyValue('--sy')).toBe('-1')
await component.setProps({ path, flip: 'horizontal' })
expect(getComputedStyle(component.element).getPropertyValue('--sx')).toBe('-1')
expect(getComputedStyle(component.element).getPropertyValue('--sy')).toBe('1')
await component.setProps({ path, flip: 'vertical' })
expect(getComputedStyle(component.element).getPropertyValue('--sx')).toBe('1')
expect(getComputedStyle(component.element).getPropertyValue('--sy')).toBe('-1')
})
it("accepts a 'rotate' property", async () => {
await component.setProps({ path, rotate: 90 })
expect(getComputedStyle(component.element).getPropertyValue('--r')).toBe('90deg')
})
})