@eturnity/eturnity_reusable_components 7.45.4 → 7.45.5-qa-elisee-7.48.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@eturnity/eturnity_reusable_components",
3
- "version": "7.45.4",
3
+ "version": "7.45.5-qa-elisee-7.48.0",
4
4
  "files": [
5
5
  "dist",
6
6
  "src"
@@ -0,0 +1,66 @@
1
+ import { mount } from '@vue/test-utils'
2
+ import RCIcon from '@/components/icon'
3
+ import theme from '@/assets/theme'
4
+ import 'jest-styled-components'
5
+ jest.mock('@/components/icon/iconCache.mjs', () => ({
6
+ fetchIcon: jest.fn(() => Promise.resolve('mocked-icon-url.svg')),
7
+ }))
8
+
9
+ describe('RCIcon.vue', () => {
10
+ it('renders icon with default props', async () => {
11
+ const wrapper = mount(RCIcon, {
12
+ props: { name: 'House' },
13
+ global: {
14
+ provide: {
15
+ theme,
16
+ },
17
+ },
18
+ })
19
+
20
+ const iconWrapper = wrapper.find('[data-test-id="icon_wrapper"]')
21
+ const iconImage = wrapper.find('[data-test-id="icon_image"]')
22
+
23
+ expect(iconWrapper.exists()).toBe(true)
24
+ expect(iconImage.exists()).toBe(true)
25
+ expect(wrapper.props('size')).toBe('30px')
26
+ })
27
+
28
+ it('renders striked line when isStriked is true', async () => {
29
+ const wrapper = mount(RCIcon, {
30
+ props: {
31
+ name: 'House',
32
+ isStriked: true,
33
+ color: 'red',
34
+ },
35
+ global: {
36
+ provide: {
37
+ theme,
38
+ },
39
+ },
40
+ })
41
+
42
+ const strikedLine = wrapper.find('[data-test-id="icon_striked_line"]')
43
+ expect(strikedLine.exists()).toBe(true)
44
+ })
45
+
46
+ it('applies correct styling based on props', async () => {
47
+ const wrapper = mount(RCIcon, {
48
+ props: {
49
+ name: 'House',
50
+ size: '60px',
51
+ color: 'red',
52
+ hoveredColor: 'blue',
53
+ backgroundColor: 'yellow',
54
+ },
55
+ global: {
56
+ provide: {
57
+ theme,
58
+ },
59
+ },
60
+ })
61
+
62
+ const iconImage = wrapper.find('[data-test-id="icon_image"]')
63
+ expect(iconImage.exists()).toBe(true)
64
+ // Add assertions for styling if needed
65
+ })
66
+ })
@@ -1,14 +1,24 @@
1
1
  <template>
2
- <Wrapper :cursor="cursor" :disabled="disabled" :size="size">
2
+ <Wrapper
3
+ :cursor="cursor"
4
+ data-test-id="icon_wrapper"
5
+ :disabled="disabled"
6
+ :size="size"
7
+ >
3
8
  <IconImage
4
9
  :animation="animation"
5
10
  :background-color="backgroundColor"
6
11
  :color="color"
12
+ data-test-id="icon_image"
7
13
  :hovered-color="hoveredColor"
8
14
  >
9
- <i v-html="icon.html"></i>
15
+ <i data-test-id="icon_svg" v-html="icon.html"></i>
10
16
  </IconImage>
11
- <StrikedLine v-if="isStriked" :color="color" />
17
+ <StrikedLine
18
+ v-if="isStriked"
19
+ :color="color"
20
+ data-test-id="icon_striked_line"
21
+ />
12
22
  </Wrapper>
13
23
  </template>
14
24
 
@@ -44,6 +44,7 @@
44
44
  :type="inputTypeData"
45
45
  :value="value"
46
46
  @blur="onInputBlur"
47
+ @focus="onInputFocus"
47
48
  @input="onChangeHandler"
48
49
  @keyup.enter="onEnterPress"
49
50
  />
@@ -367,6 +368,9 @@
367
368
  this.validateInput($event.target.value)
368
369
  this.$emit('input-blur', $event.target.value)
369
370
  },
371
+ onInputFocus($event) {
372
+ this.$emit('input-focus', $event.target.value)
373
+ },
370
374
  toggleShowPassword() {
371
375
  this.inputTypeData =
372
376
  this.inputTypeData === 'password' ? 'text' : 'password'