@eturnity/eturnity_reusable_components 8.13.13-EPDM-9631.0 → 8.13.13-EPDM-12459.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/README.md +29 -29
- package/package.json +85 -85
- package/src/App.vue +30 -30
- package/src/Test.vue +64 -64
- package/src/assets/icons/arrow_down.svg +3 -3
- package/src/assets/icons/arrow_up_red.svg +3 -3
- package/src/assets/icons/black_spinner.svg +35 -35
- package/src/assets/icons/delete_icon.svg +11 -11
- package/src/assets/icons/delete_icon_gray.svg +11 -11
- package/src/assets/icons/drag_icon.svg +8 -8
- package/src/assets/icons/external_icon.svg +6 -6
- package/src/assets/icons/language_icon.svg +6 -6
- package/src/assets/icons/pdf_icon.svg +6 -6
- package/src/assets/icons/plus_button.svg +4 -4
- package/src/assets/icons/search_icon_black.svg +3 -3
- package/src/assets/icons/subposition_icon.svg +3 -3
- package/src/assets/icons/subposition_marker.svg +3 -3
- package/src/assets/icons/warning_icon.svg +3 -3
- package/src/assets/svgIcons/2d_active.svg +7 -7
- package/src/assets/svgIcons/2d_inactive.svg +8 -8
- package/src/assets/svgIcons/3d_active.svg +7 -7
- package/src/assets/svgIcons/3d_inactive.svg +8 -8
- package/src/assets/svgIcons/_readme.md +7 -7
- package/src/assets/svgIcons/accept.svg +5 -5
- package/src/assets/svgIcons/activate_panels_active.svg +22 -22
- package/src/assets/svgIcons/activate_panels_inactive.svg +20 -20
- package/src/assets/svgIcons/add_icon-1.svg +3 -3
- package/src/assets/svgIcons/add_icon.svg +4 -4
- package/src/assets/svgIcons/address_book.svg +3 -3
- package/src/assets/svgIcons/adjust_roof.svg +6 -6
- package/src/assets/svgIcons/after_sale_as_a_service.svg +6 -6
- package/src/assets/svgIcons/all_good.svg +3 -3
- package/src/assets/svgIcons/angle_active.svg +5 -5
- package/src/assets/svgIcons/angle_inactive.svg +4 -4
- package/src/assets/svgIcons/area_active.svg +11 -11
- package/src/assets/svgIcons/area_inactive.svg +26 -26
- package/src/assets/svgIcons/areas_tool.svg +14 -14
- package/src/assets/svgIcons/arrow_down.svg +3 -3
- package/src/assets/svgIcons/arrow_down_unfilled.svg +4 -4
- package/src/assets/svgIcons/arrow_left.svg +4 -4
- package/src/assets/svgIcons/arrow_right.svg +4 -4
- package/src/assets/svgIcons/arrow_up.svg +3 -3
- package/src/assets/svgIcons/arrow_up_unfilled.svg +4 -4
- package/src/assets/svgIcons/attachment.svg +3 -3
- package/src/assets/svgIcons/base_layer.svg +3 -3
- package/src/assets/svgIcons/battery.svg +3 -3
- package/src/assets/svgIcons/bell.svg +3 -3
- package/src/assets/svgIcons/bell_alt.svg +3 -3
- package/src/assets/svgIcons/bexio.svg +4 -4
- package/src/assets/svgIcons/bold.svg +3 -3
- package/src/assets/svgIcons/bom.svg +3 -3
- package/src/assets/svgIcons/bom_generation.svg +10 -10
- package/src/assets/svgIcons/bookmaker.svg +3 -3
- package/src/assets/svgIcons/bubble.svg +3 -3
- package/src/assets/svgIcons/bug.svg +5 -5
- package/src/assets/svgIcons/buildings.svg +55 -55
- package/src/assets/svgIcons/bullet_list.svg +8 -8
- package/src/assets/svgIcons/calendar.svg +7 -7
- package/src/assets/svgIcons/calendar_icon.svg +7 -7
- package/src/assets/svgIcons/call.svg +3 -3
- package/src/assets/svgIcons/camera.svg +3 -3
- package/src/assets/svgIcons/car.svg +3 -3
- package/src/assets/svgIcons/cart.svg +3 -3
- package/src/assets/svgIcons/charger_icon_white.svg +44 -44
- package/src/assets/svgIcons/checkbox.svg +3 -3
- package/src/assets/svgIcons/checkmark.svg +3 -3
- package/src/assets/svgIcons/checkmark_white.svg +4 -4
- package/src/assets/svgIcons/clear_formatting.svg +7 -7
- package/src/assets/svgIcons/clenergy.svg +3 -3
- package/src/assets/svgIcons/clickable_info.svg +4 -4
- package/src/assets/svgIcons/clickable_info_white.svg +5 -5
- package/src/assets/svgIcons/clip.svg +3 -3
- package/src/assets/svgIcons/clock.svg +17 -17
- package/src/assets/svgIcons/clock_full.svg +3 -3
- package/src/assets/svgIcons/close.svg +4 -4
- package/src/assets/svgIcons/co_branding.svg +5 -5
- package/src/assets/svgIcons/collapse.svg +4 -4
- package/src/assets/svgIcons/collapse_all.svg +3 -3
- package/src/assets/svgIcons/collections.svg +3 -3
- package/src/assets/svgIcons/component_library.svg +7 -7
- package/src/assets/svgIcons/consumption_tariffs.svg +43 -43
- package/src/assets/svgIcons/context_menu-1.svg +6 -6
- package/src/assets/svgIcons/context_menu-2.svg +5 -5
- package/src/assets/svgIcons/context_menu.svg +5 -5
- package/src/assets/svgIcons/context_menu_tabs.svg +5 -5
- package/src/assets/svgIcons/cross.svg +4 -4
- package/src/assets/svgIcons/current_variant.svg +4 -4
- package/src/assets/svgIcons/customer.svg +3 -3
- package/src/assets/svgIcons/dashboard.svg +3 -3
- package/src/assets/svgIcons/data_transfer.svg +3 -3
- package/src/assets/svgIcons/deadline.svg +4 -4
- package/src/assets/svgIcons/deal_flow.svg +3 -3
- package/src/assets/svgIcons/delete.svg +4 -4
- package/src/assets/svgIcons/delete_area_active.svg +16 -16
- package/src/assets/svgIcons/delete_area_inactive.svg +15 -15
- package/src/assets/svgIcons/direction_active-1.svg +12 -12
- package/src/assets/svgIcons/direction_active.svg +5 -5
- package/src/assets/svgIcons/direction_arrow.svg +4 -4
- package/src/assets/svgIcons/direction_inactive.svg +4 -4
- package/src/assets/svgIcons/dislike.svg +3 -3
- package/src/assets/svgIcons/distance_tool.svg +8 -8
- package/src/assets/svgIcons/distances_active.svg +9 -9
- package/src/assets/svgIcons/distances_inactive.svg +8 -8
- package/src/assets/svgIcons/distort_tool.svg +10 -10
- package/src/assets/svgIcons/distort_tool2.svg +16 -16
- package/src/assets/svgIcons/document.svg +3 -3
- package/src/assets/svgIcons/documents.svg +3 -3
- package/src/assets/svgIcons/downarrow.svg +3 -3
- package/src/assets/svgIcons/download.svg +4 -4
- package/src/assets/svgIcons/drag_icon.svg +8 -8
- package/src/assets/svgIcons/draggable_corner.svg +5 -5
- package/src/assets/svgIcons/draw_tool.svg +3 -3
- package/src/assets/svgIcons/duplicate-1.svg +8 -8
- package/src/assets/svgIcons/duplicate-2.svg +5 -5
- package/src/assets/svgIcons/duplicate.svg +4 -4
- package/src/assets/svgIcons/e-mobility_configurator.svg +6 -6
- package/src/assets/svgIcons/e_signature.svg +5 -5
- package/src/assets/svgIcons/edit_button.svg +3 -3
- package/src/assets/svgIcons/efs.svg +5 -5
- package/src/assets/svgIcons/electricity_tariff.svg +3 -3
- package/src/assets/svgIcons/email.svg +3 -3
- package/src/assets/svgIcons/ems-1.svg +3 -3
- package/src/assets/svgIcons/ems.svg +3 -3
- package/src/assets/svgIcons/end_of_the_list.svg +5 -5
- package/src/assets/svgIcons/energy_meter.svg +3 -3
- package/src/assets/svgIcons/erase.svg +4 -4
- package/src/assets/svgIcons/erase_white.svg +4 -4
- package/src/assets/svgIcons/expand_all.svg +4 -4
- package/src/assets/svgIcons/export_document.svg +3 -3
- package/src/assets/svgIcons/external_icon.svg +5 -5
- package/src/assets/svgIcons/fav_icon.svg +4 -4
- package/src/assets/svgIcons/finance.svg +3 -3
- package/src/assets/svgIcons/financing_for_pv-1.svg +5 -5
- package/src/assets/svgIcons/financing_for_pv-2.svg +3 -3
- package/src/assets/svgIcons/financing_for_pv.svg +3 -3
- package/src/assets/svgIcons/finish-1.svg +4 -4
- package/src/assets/svgIcons/finish.svg +3 -3
- package/src/assets/svgIcons/flatten.svg +11 -11
- package/src/assets/svgIcons/flatten_roof.svg +20 -20
- package/src/assets/svgIcons/folder.svg +3 -3
- package/src/assets/svgIcons/free_technology.svg +3 -3
- package/src/assets/svgIcons/handle.svg +5 -5
- package/src/assets/svgIcons/heat_calc.svg +7 -7
- package/src/assets/svgIcons/heat_pump.svg +5 -5
- package/src/assets/svgIcons/heating_system.svg +3 -3
- package/src/assets/svgIcons/height_equalize.svg +3 -3
- package/src/assets/svgIcons/height_snap.svg +3 -3
- package/src/assets/svgIcons/house.svg +3 -3
- package/src/assets/svgIcons/house_3d-1.svg +7 -7
- package/src/assets/svgIcons/house_3d.svg +7 -7
- package/src/assets/svgIcons/hybrid.svg +4 -4
- package/src/assets/svgIcons/inclination.svg +2 -2
- package/src/assets/svgIcons/info.svg +3 -3
- package/src/assets/svgIcons/initial_situation.svg +3 -3
- package/src/assets/svgIcons/integrations.svg +3 -3
- package/src/assets/svgIcons/intro-tour-1.svg +3 -3
- package/src/assets/svgIcons/intro-tour.svg +3 -3
- package/src/assets/svgIcons/inverter.svg +3 -3
- package/src/assets/svgIcons/italic.svg +3 -3
- package/src/assets/svgIcons/k2.svg +4 -4
- package/src/assets/svgIcons/key.svg +3 -3
- package/src/assets/svgIcons/lake.svg +29 -29
- package/src/assets/svgIcons/layers_close.svg +4 -4
- package/src/assets/svgIcons/layers_open.svg +4 -4
- package/src/assets/svgIcons/lead_marketplace.svg +6 -6
- package/src/assets/svgIcons/lead_provider.svg +4 -4
- package/src/assets/svgIcons/length_2d.svg +2 -2
- package/src/assets/svgIcons/length_3d.svg +4 -4
- package/src/assets/svgIcons/length_calculator.svg +2 -2
- package/src/assets/svgIcons/length_in_2d_active.svg +12 -12
- package/src/assets/svgIcons/length_in_2d_inctive.svg +13 -13
- package/src/assets/svgIcons/light_bulb.svg +3 -3
- package/src/assets/svgIcons/like.svg +3 -3
- package/src/assets/svgIcons/line_graph.svg +3 -3
- package/src/assets/svgIcons/local_subsidies.svg +18 -18
- package/src/assets/svgIcons/location.svg +3 -3
- package/src/assets/svgIcons/lock.svg +3 -3
- package/src/assets/svgIcons/logout.svg +3 -3
- package/src/assets/svgIcons/loop.svg +3 -3
- package/src/assets/svgIcons/low-vegetation.svg +37 -37
- package/src/assets/svgIcons/lunch.svg +4 -4
- package/src/assets/svgIcons/magic_tool.svg +6 -6
- package/src/assets/svgIcons/map_icon.svg +5 -5
- package/src/assets/svgIcons/map_settings.svg +3 -3
- package/src/assets/svgIcons/margin_tool.svg +4 -4
- package/src/assets/svgIcons/meeting.svg +6 -6
- package/src/assets/svgIcons/module.svg +3 -3
- package/src/assets/svgIcons/move_copy.svg +4 -4
- package/src/assets/svgIcons/move_down.svg +3 -3
- package/src/assets/svgIcons/move_up.svg +3 -3
- package/src/assets/svgIcons/new_area_inactive.svg +11 -11
- package/src/assets/svgIcons/next.svg +4 -4
- package/src/assets/svgIcons/normal-tg.svg +30 -30
- package/src/assets/svgIcons/normal-vegetation.svg +53 -53
- package/src/assets/svgIcons/not_equal_to.svg +3 -3
- package/src/assets/svgIcons/numbered_list.svg +6 -6
- package/src/assets/svgIcons/obstacle_tool.svg +8 -8
- package/src/assets/svgIcons/obstacle_tool_origin.svg +3 -3
- package/src/assets/svgIcons/offset_tool.svg +8 -8
- package/src/assets/svgIcons/open-tg.svg +21 -21
- package/src/assets/svgIcons/optimizer.svg +3 -3
- package/src/assets/svgIcons/outline_tool.svg +11 -11
- package/src/assets/svgIcons/pan_tool.svg +12 -12
- package/src/assets/svgIcons/panels_tool.svg +8 -8
- package/src/assets/svgIcons/pen_tool.svg +4 -4
- package/src/assets/svgIcons/picker_tool.svg +4 -4
- package/src/assets/svgIcons/picture.svg +3 -3
- package/src/assets/svgIcons/pin.svg +5 -5
- package/src/assets/svgIcons/plus_button.svg +4 -4
- package/src/assets/svgIcons/presentation.svg +3 -3
- package/src/assets/svgIcons/previous.svg +4 -4
- package/src/assets/svgIcons/profile-1.svg +4 -4
- package/src/assets/svgIcons/profile.svg +3 -3
- package/src/assets/svgIcons/profitability.svg +3 -3
- package/src/assets/svgIcons/project_analysis.svg +3 -3
- package/src/assets/svgIcons/project_settings.svg +3 -3
- package/src/assets/svgIcons/protected-tg.svg +47 -47
- package/src/assets/svgIcons/pv.svg +3 -3
- package/src/assets/svgIcons/question_mark.svg +3 -3
- package/src/assets/svgIcons/question_mark_white.svg +4 -4
- package/src/assets/svgIcons/quotations.svg +6 -6
- package/src/assets/svgIcons/redo.svg +6 -6
- package/src/assets/svgIcons/reorder_string.svg +3 -3
- package/src/assets/svgIcons/resizer.svg +5 -5
- package/src/assets/svgIcons/roof_layer.svg +3 -3
- package/src/assets/svgIcons/rotate_tool.svg +3 -3
- package/src/assets/svgIcons/rotate_view.svg +5 -5
- package/src/assets/svgIcons/ruler_tool.svg +3 -3
- package/src/assets/svgIcons/run_simulation.svg +3 -3
- package/src/assets/svgIcons/save.svg +3 -3
- package/src/assets/svgIcons/scaling_tool.svg +8 -8
- package/src/assets/svgIcons/sea.svg +34 -34
- package/src/assets/svgIcons/search.svg +3 -3
- package/src/assets/svgIcons/security.svg +3 -3
- package/src/assets/svgIcons/settings.svg +3 -3
- package/src/assets/svgIcons/show_in_a_new_tab.svg +12 -12
- package/src/assets/svgIcons/smartphone.svg +4 -4
- package/src/assets/svgIcons/solar_calc.svg +13 -13
- package/src/assets/svgIcons/solarmarkt.svg +3 -3
- package/src/assets/svgIcons/sorting.svg +4 -4
- package/src/assets/svgIcons/split.svg +12 -12
- package/src/assets/svgIcons/star.svg +3 -3
- package/src/assets/svgIcons/start_of_the_list.svg +5 -5
- package/src/assets/svgIcons/strikethrough.svg +4 -4
- package/src/assets/svgIcons/string_design.svg +5 -5
- package/src/assets/svgIcons/string_directions.svg +10 -10
- package/src/assets/svgIcons/subscriptions.svg +3 -3
- package/src/assets/svgIcons/subsidies-2.svg +3 -3
- package/src/assets/svgIcons/subsidies.svg +3 -3
- package/src/assets/svgIcons/subtract_icon.svg +3 -3
- package/src/assets/svgIcons/suitcase.svg +3 -3
- package/src/assets/svgIcons/summer.svg +3 -3
- package/src/assets/svgIcons/switch_polarity.svg +5 -5
- package/src/assets/svgIcons/template_icon_not_clickable.svg +6 -6
- package/src/assets/svgIcons/transfer.svg +4 -4
- package/src/assets/svgIcons/transparent_warning.svg +4 -4
- package/src/assets/svgIcons/trim_tool.svg +4 -4
- package/src/assets/svgIcons/truck.svg +3 -3
- package/src/assets/svgIcons/underlined.svg +3 -3
- package/src/assets/svgIcons/undo.svg +6 -6
- package/src/assets/svgIcons/uparrow.svg +3 -3
- package/src/assets/svgIcons/update.svg +3 -3
- package/src/assets/svgIcons/upload_avatar-1.svg +12 -12
- package/src/assets/svgIcons/upload_avatar.svg +5 -5
- package/src/assets/svgIcons/upload_image.svg +8 -8
- package/src/assets/svgIcons/upload_image_tool.svg +7 -7
- package/src/assets/svgIcons/variants.svg +3 -3
- package/src/assets/svgIcons/vdv.svg +5 -5
- package/src/assets/svgIcons/vertical_tool.svg +3 -3
- package/src/assets/svgIcons/virtual_storage.svg +3 -3
- package/src/assets/svgIcons/warning.svg +4 -4
- package/src/assets/svgIcons/warning_triangle.svg +3 -3
- package/src/assets/svgIcons/warning_triangle_white.svg +5 -5
- package/src/assets/svgIcons/way.svg +5 -5
- package/src/assets/svgIcons/wifi.svg +3 -3
- package/src/assets/svgIcons/winter.svg +3 -3
- package/src/assets/svgIcons/workflow_template.svg +11 -11
- package/src/assets/tests/__mocks__/iconCache.js +1 -1
- package/src/assets/tests/__mocks__/svgMock.js +1 -1
- package/src/assets/tests/helpers.js +12 -12
- package/src/assets/theme.js +623 -623
- package/src/components/addNewButton/AddNewButton.stories.js +17 -17
- package/src/components/addNewButton/addNewButton.spec.js +23 -23
- package/src/components/addNewButton/index.vue +66 -66
- package/src/components/banner/actionBanner/ActionBanner.stories.js +45 -45
- package/src/components/banner/actionBanner/actionBanner.spec.js +76 -76
- package/src/components/banner/actionBanner/index.vue +86 -86
- package/src/components/banner/banner/Banner.stories.js +64 -64
- package/src/components/banner/banner/banner.spec.js +149 -149
- package/src/components/banner/banner/index.vue +205 -205
- package/src/components/banner/infoBanner/InfoBanner.spec.js +70 -70
- package/src/components/banner/infoBanner/InfoBanner.stories.js +42 -42
- package/src/components/banner/infoBanner/index.vue +97 -97
- package/src/components/banner/notificationBanner/index.vue +131 -131
- package/src/components/buttons/buttonIcon/index.vue +250 -250
- package/src/components/buttons/closeButton/CloseButton.stories.js +25 -25
- package/src/components/buttons/closeButton/index.vue +62 -62
- package/src/components/buttons/mainButton/MainButton.stories.js +51 -51
- package/src/components/buttons/mainButton/index.vue +213 -213
- package/src/components/buttons/mainButton/mainButton.spec.js +35 -35
- package/src/components/card/Card.stories.js +79 -79
- package/src/components/card/card.spec.js +135 -135
- package/src/components/card/index.vue +116 -116
- package/src/components/collapsableInfoText/index.vue +127 -127
- package/src/components/deleteIcon/DeleteIcon.stories.js +29 -29
- package/src/components/deleteIcon/index.vue +78 -78
- package/src/components/draggableInputHandle/index.vue +46 -46
- package/src/components/dropdown/Dropdown.stories.js +53 -53
- package/src/components/dropdown/index.vue +138 -138
- package/src/components/errorMessage/index.vue +64 -64
- package/src/components/filter/filterSettings.vue +670 -670
- package/src/components/filter/index.vue +154 -154
- package/src/components/filter/parentDropdown.vue +91 -91
- package/src/components/icon/Icons.stories.js +31 -31
- package/src/components/icon/icon.spec.js +66 -66
- package/src/components/icon/iconCache.mjs +23 -23
- package/src/components/icon/iconCollection.vue +83 -83
- package/src/components/icon/index.vue +197 -197
- package/src/components/iconWrapper/index.vue +184 -184
- package/src/components/infoCard/InfoCard.stories.js +170 -170
- package/src/components/infoCard/defaultProps.js +7 -7
- package/src/components/infoCard/index.vue +156 -156
- package/src/components/infoCard/infoCard.spec.js +64 -64
- package/src/components/infoLabel/index.vue +63 -63
- package/src/components/infoText/constants.js +4 -4
- package/src/components/infoText/index.vue +645 -645
- package/src/components/infoText/infoText.spec.js +62 -62
- package/src/components/infoText/infoText.stories.js +48 -48
- package/src/components/infoText/placeholder.vue +225 -225
- package/src/components/inputs/checkbox/Checkbox.stories.js +63 -63
- package/src/components/inputs/checkbox/checkbox.spec.js +109 -109
- package/src/components/inputs/checkbox/index.vue +250 -250
- package/src/components/inputs/inputNumber/InputNumber.stories.js +150 -150
- package/src/components/inputs/inputNumber/index.vue +990 -990
- package/src/components/inputs/inputNumberQuestion/index.vue +218 -218
- package/src/components/inputs/inputText/InputText.stories.js +70 -70
- package/src/components/inputs/inputText/index.vue +463 -463
- package/src/components/inputs/inputText/inputText.spec.js +588 -588
- package/src/components/inputs/radioButton/RadioButton.stories.js +77 -77
- package/src/components/inputs/radioButton/defaultProps.js +31 -31
- package/src/components/inputs/radioButton/index.vue +336 -336
- package/src/components/inputs/radioButton/radioButton.spec.js +306 -306
- package/src/components/inputs/searchInput/SearchInput.stories.js +66 -66
- package/src/components/inputs/searchInput/defaultProps.js +12 -12
- package/src/components/inputs/searchInput/index.vue +165 -165
- package/src/components/inputs/searchInput/searchInput.spec.js +64 -64
- package/src/components/inputs/select/index.vue +1041 -968
- package/src/components/inputs/select/option/index.vue +164 -164
- package/src/components/inputs/select/select.stories.js +58 -58
- package/src/components/inputs/slider/index.vue +126 -126
- package/src/components/inputs/switchField/index.vue +254 -254
- package/src/components/inputs/textAreaInput/TextAreaInput.stories.js +127 -127
- package/src/components/inputs/textAreaInput/index.vue +204 -204
- package/src/components/inputs/toggle/Toggle.stories.js +77 -77
- package/src/components/inputs/toggle/index.vue +322 -322
- package/src/components/inputs/toggle/toggle.spec.js +102 -102
- package/src/components/label/index.vue +98 -98
- package/src/components/markerItem/index.vue +95 -95
- package/src/components/modals/actionModal/index.vue +64 -64
- package/src/components/modals/infoModal/index.vue +52 -52
- package/src/components/modals/modal/index.vue +213 -200
- package/src/components/modals/modal/modal.stories.js +31 -31
- package/src/components/navigationTabs/index.vue +114 -114
- package/src/components/pageSubtitle/PageSubtitle.stories.js +59 -59
- package/src/components/pageSubtitle/index.vue +78 -78
- package/src/components/pageSubtitle/pageSubtitle.spec.js +46 -46
- package/src/components/pageTitle/PageTitle.stories.js +95 -95
- package/src/components/pageTitle/index.vue +91 -91
- package/src/components/pageTitle/pageTitle.spec.js +46 -46
- package/src/components/pagination/index.vue +148 -148
- package/src/components/panelRangeInfo/index.vue +196 -196
- package/src/components/progressBar/index.vue +125 -125
- package/src/components/projectMarker/index.vue +301 -301
- package/src/components/rangeSlider/Slider.vue +578 -578
- package/src/components/rangeSlider/index.vue +517 -517
- package/src/components/rangeSlider/utils/dom.js +49 -49
- package/src/components/rangeSlider/utils/fns.js +26 -26
- package/src/components/roundTabs/index.vue +107 -107
- package/src/components/selectedOptions/index.vue +462 -462
- package/src/components/selectedOptions/selectedOptions.spec.js +176 -176
- package/src/components/selectedOptions/selectedOptions.stories.js +155 -155
- package/src/components/sideMenu/index.vue +325 -325
- package/src/components/spinner/Spinner.stories.js +34 -34
- package/src/components/spinner/index.vue +129 -129
- package/src/components/spinner/spinner.spec.js +69 -69
- package/src/components/spinnerGif/index.vue +98 -98
- package/src/components/tableDropdown/index.vue +692 -692
- package/src/components/tables/mainTable/exampleNested.vue +328 -328
- package/src/components/tables/mainTable/index.vue +523 -523
- package/src/components/tables/viewTable/index.vue +195 -195
- package/src/components/tabsHeader/index.vue +95 -95
- package/src/components/threeDots/index.vue +413 -413
- package/src/components/videoThumbnail/index.vue +103 -103
- package/src/components/videoThumbnail/videoThumbnail.stories.js +33 -33
- package/src/helpers/currencyMapping.js +28 -28
- package/src/helpers/numberConverter.js +103 -103
- package/src/helpers/translateLang.js +128 -128
- package/src/main.js +7 -7
- package/src/mixins/inputValidations.js +97 -97
- package/src/router/dynamicRoutes.js +23 -23
- package/src/stories/Button.stories.js +48 -48
- package/src/stories/Button.vue +52 -52
- package/src/stories/Configure.mdx +364 -364
- package/src/stories/Header.stories.js +41 -41
- package/src/stories/Header.vue +59 -59
- package/src/stories/Page.stories.js +30 -30
- package/src/stories/Page.vue +83 -83
- package/src/stories/button.css +30 -30
- package/src/stories/header.css +32 -32
- package/src/stories/page.css +69 -69
- package/src/utils/index.js +12 -12
- package/src/helpers/dateTimeFormatting.js +0 -51
@@ -1,588 +1,588 @@
|
|
1
|
-
/* eslint-disable */
|
2
|
-
import { mount, Wrapper } from '@vue/test-utils'
|
3
|
-
import RCInputText from '@/components/inputs/inputText/index'
|
4
|
-
import theme from '@/assets/theme'
|
5
|
-
|
6
|
-
jest.mock('@/components/icon/iconCache.mjs', () => ({
|
7
|
-
// need to mock this due to how jest handles import.meta
|
8
|
-
fetchIcon: jest.fn(() => Promise.resolve('mocked-icon-url.svg')),
|
9
|
-
}))
|
10
|
-
|
11
|
-
const wrapper1 = mount(RCInputText, {
|
12
|
-
props: {
|
13
|
-
placeholder: 'placeholderText',
|
14
|
-
value: 'Test value',
|
15
|
-
label: 'Test label',
|
16
|
-
},
|
17
|
-
global: {
|
18
|
-
provide: {
|
19
|
-
theme,
|
20
|
-
},
|
21
|
-
},
|
22
|
-
})
|
23
|
-
const wrapperPassword = mount(RCInputText, {
|
24
|
-
props: {
|
25
|
-
placeholder: 'placeholderText',
|
26
|
-
value: 'Test value',
|
27
|
-
label: 'Test label',
|
28
|
-
inputType: 'password',
|
29
|
-
},
|
30
|
-
global: {
|
31
|
-
provide: {
|
32
|
-
theme,
|
33
|
-
},
|
34
|
-
},
|
35
|
-
})
|
36
|
-
describe('RCInputText.vue', () => {
|
37
|
-
let consoleWarnSpy
|
38
|
-
beforeEach(() => {
|
39
|
-
consoleWarnSpy = jest.spyOn(console, 'warn').mockImplementation(() => {})
|
40
|
-
})
|
41
|
-
afterEach(() => {
|
42
|
-
consoleWarnSpy.mockRestore()
|
43
|
-
})
|
44
|
-
// initial rendering
|
45
|
-
it('input is rendered', async () => {
|
46
|
-
const inputTextWrapper = wrapper1.find('[data-test-id="input_wrapper"]')
|
47
|
-
expect(inputTextWrapper.exists()).toBe(true)
|
48
|
-
})
|
49
|
-
// event management
|
50
|
-
it('input is rendered and emits inputChange when input event is triggered.', async () => {
|
51
|
-
const inputElement = wrapper1.find('input')
|
52
|
-
await inputElement.setValue('Test Input Value')
|
53
|
-
const emittedInputChangeEvent = wrapper1.emitted('input-change')
|
54
|
-
expect(emittedInputChangeEvent).toBeTruthy()
|
55
|
-
expect(emittedInputChangeEvent).toHaveLength(1) // Check if the event was emitted exactly once
|
56
|
-
expect(emittedInputChangeEvent[0]).toEqual(['Test Input Value'])
|
57
|
-
})
|
58
|
-
it('input emits on-enter-click', async () => {
|
59
|
-
const inputElement = wrapper1.find('input')
|
60
|
-
await inputElement.trigger('keyup.enter')
|
61
|
-
const emittedOnEnterClickEvent = wrapper1.emitted('on-enter-click')
|
62
|
-
expect(emittedOnEnterClickEvent).toBeTruthy()
|
63
|
-
expect(emittedOnEnterClickEvent).toHaveLength(1) // Check if the event was emitted exactly once
|
64
|
-
expect(emittedOnEnterClickEvent[0]).toEqual([]) // Check if the event was emitted exactly once
|
65
|
-
})
|
66
|
-
it('input emits on-blur', async () => {
|
67
|
-
const inputElement = wrapper1.find('input')
|
68
|
-
await inputElement.setValue('Test Input Value')
|
69
|
-
await inputElement.trigger('blur')
|
70
|
-
const emittedOnBlurEvent = wrapper1.emitted('input-blur')
|
71
|
-
expect(emittedOnBlurEvent).toBeTruthy()
|
72
|
-
expect(emittedOnBlurEvent).toHaveLength(1) // Check if the event was emitted exactly once
|
73
|
-
expect(emittedOnBlurEvent[0]).toEqual(['Test Input Value']) // Check if the event was emitted exactly once
|
74
|
-
})
|
75
|
-
it('input password visibility click trigger input type change', async () => {
|
76
|
-
const inputElement = wrapperPassword.find('input')
|
77
|
-
const passwordVisibilityIconElement = wrapperPassword.find(
|
78
|
-
'[data-test-id="password_visiblity_change_icon"]'
|
79
|
-
)
|
80
|
-
expect(passwordVisibilityIconElement.exists()).toBe(true)
|
81
|
-
await passwordVisibilityIconElement.trigger('click')
|
82
|
-
let inputType = inputElement.attributes().type
|
83
|
-
expect(inputType).toBe('text')
|
84
|
-
await passwordVisibilityIconElement.trigger('click')
|
85
|
-
inputType = inputElement.attributes().type
|
86
|
-
expect(inputType).toBe('password')
|
87
|
-
await passwordVisibilityIconElement.trigger('click')
|
88
|
-
inputType = inputElement.attributes().type
|
89
|
-
expect(inputType).toBe('text')
|
90
|
-
})
|
91
|
-
//Test conditional visibility
|
92
|
-
it('label visibility check', async () => {
|
93
|
-
const wrapper = mount(RCInputText, {
|
94
|
-
props: {
|
95
|
-
value: 'Test value',
|
96
|
-
label: 'Test label',
|
97
|
-
},
|
98
|
-
global: {
|
99
|
-
provide: {
|
100
|
-
theme,
|
101
|
-
},
|
102
|
-
},
|
103
|
-
})
|
104
|
-
const label = wrapper.find('[data-test-id="label_wrapper"]')
|
105
|
-
expect(label.exists()).toBe(true)
|
106
|
-
expect(label.text()).toContain('Test label')
|
107
|
-
})
|
108
|
-
it('label invisibility check', async () => {
|
109
|
-
const wrapper = mount(RCInputText, {
|
110
|
-
props: {
|
111
|
-
value: 'Test value',
|
112
|
-
},
|
113
|
-
global: {
|
114
|
-
provide: {
|
115
|
-
theme,
|
116
|
-
},
|
117
|
-
},
|
118
|
-
})
|
119
|
-
const label = wrapper.find('[data-test-id="label_wrapper"]')
|
120
|
-
expect(label.exists()).toBe(false)
|
121
|
-
})
|
122
|
-
it('label optional visibility check', async () => {
|
123
|
-
const wrapper = mount(RCInputText, {
|
124
|
-
props: {
|
125
|
-
value: 'Test value',
|
126
|
-
label: 'Test label',
|
127
|
-
labelOptional: true,
|
128
|
-
},
|
129
|
-
global: {
|
130
|
-
provide: {
|
131
|
-
theme,
|
132
|
-
},
|
133
|
-
},
|
134
|
-
})
|
135
|
-
const labelOptional = wrapper.find('[data-test-id="label_optional"]')
|
136
|
-
expect(labelOptional.exists()).toBe(true)
|
137
|
-
})
|
138
|
-
it('label optional invisibility check', async () => {
|
139
|
-
const wrapper = mount(RCInputText, {
|
140
|
-
props: {
|
141
|
-
value: 'Test value',
|
142
|
-
},
|
143
|
-
global: {
|
144
|
-
provide: {
|
145
|
-
theme,
|
146
|
-
},
|
147
|
-
},
|
148
|
-
})
|
149
|
-
const labelOptional = wrapper.find('[data-test-id="label_optional"]')
|
150
|
-
expect(labelOptional.exists()).toBe(false)
|
151
|
-
})
|
152
|
-
it('infoTextMessage visibility check', async () => {
|
153
|
-
const wrapper = mount(RCInputText, {
|
154
|
-
props: {
|
155
|
-
value: 'Test value',
|
156
|
-
infoTextMessage: 'infoTextMessage test',
|
157
|
-
label: 'Test label',
|
158
|
-
},
|
159
|
-
global: {
|
160
|
-
provide: {
|
161
|
-
theme,
|
162
|
-
},
|
163
|
-
},
|
164
|
-
})
|
165
|
-
const InfoTextMessage = wrapper.find('[data-test-id="info_text_message"]')
|
166
|
-
expect(InfoTextMessage.exists()).toBe(true)
|
167
|
-
})
|
168
|
-
it('infoTextMessage invibility check', async () => {
|
169
|
-
const wrapper = mount(RCInputText, {
|
170
|
-
props: {
|
171
|
-
value: 'Test value',
|
172
|
-
label: 'Test label',
|
173
|
-
},
|
174
|
-
global: {
|
175
|
-
provide: {
|
176
|
-
theme,
|
177
|
-
},
|
178
|
-
},
|
179
|
-
})
|
180
|
-
const InfoTextMessage = wrapper.find('[data-test-id="info_text_message"]')
|
181
|
-
expect(InfoTextMessage.exists()).toBe(false)
|
182
|
-
})
|
183
|
-
it('error visibility check', async () => {
|
184
|
-
const wrapper = mount(RCInputText, {
|
185
|
-
props: {
|
186
|
-
value: 'Test value',
|
187
|
-
isError: true,
|
188
|
-
errorMessage: 'Error message test',
|
189
|
-
label: 'Test label',
|
190
|
-
},
|
191
|
-
global: {
|
192
|
-
provide: {
|
193
|
-
theme,
|
194
|
-
},
|
195
|
-
},
|
196
|
-
})
|
197
|
-
const errorWrapper = wrapper.find('[data-test-id="error_wrapper"]')
|
198
|
-
const errorMessageWrapper = wrapper.find(
|
199
|
-
'[data-test-id="error_message_wrapper"]'
|
200
|
-
)
|
201
|
-
expect(errorWrapper.exists()).toBe(true)
|
202
|
-
expect(errorMessageWrapper.exists()).toBe(true)
|
203
|
-
expect(errorMessageWrapper.text()).toContain('Error message test')
|
204
|
-
})
|
205
|
-
it('error invibility check', async () => {
|
206
|
-
const wrapper = mount(RCInputText, {
|
207
|
-
props: {
|
208
|
-
value: 'Test value',
|
209
|
-
label: 'Test label',
|
210
|
-
},
|
211
|
-
global: {
|
212
|
-
provide: {
|
213
|
-
theme,
|
214
|
-
},
|
215
|
-
},
|
216
|
-
})
|
217
|
-
const errorWrapper = wrapper.find('[data-test-id="error_wrapper"]')
|
218
|
-
const errorMessageWrapper = wrapper.find(
|
219
|
-
'[data-test-id="error_message_wrapper"]'
|
220
|
-
)
|
221
|
-
expect(errorWrapper.exists()).toBe(false)
|
222
|
-
expect(errorMessageWrapper.exists()).toBe(false)
|
223
|
-
})
|
224
|
-
//Test that the component handles different prop types correctly and throws appropriate warnings for invalid props.
|
225
|
-
it('validation of prop type - placeholder - not String', async () => {
|
226
|
-
mount(RCInputText, {
|
227
|
-
props: {
|
228
|
-
placeholder: 42,
|
229
|
-
value: 'value test',
|
230
|
-
},
|
231
|
-
global: {
|
232
|
-
provide: {
|
233
|
-
theme,
|
234
|
-
},
|
235
|
-
},
|
236
|
-
})
|
237
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
238
|
-
})
|
239
|
-
it('validation of prop type - alignItems - not horizontal or vertical', async () => {
|
240
|
-
mount(RCInputText, {
|
241
|
-
props: {
|
242
|
-
value: 'value test',
|
243
|
-
alignItems: 'top',
|
244
|
-
},
|
245
|
-
global: {
|
246
|
-
provide: {
|
247
|
-
theme,
|
248
|
-
},
|
249
|
-
},
|
250
|
-
})
|
251
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
252
|
-
})
|
253
|
-
it('validation of prop type - isError - not Boolean', async () => {
|
254
|
-
mount(RCInputText, {
|
255
|
-
props: {
|
256
|
-
value: 'value test',
|
257
|
-
isError: 'true',
|
258
|
-
},
|
259
|
-
global: {
|
260
|
-
provide: {
|
261
|
-
theme,
|
262
|
-
},
|
263
|
-
},
|
264
|
-
})
|
265
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
266
|
-
})
|
267
|
-
it('validation of prop type - inputWidth - not String', async () => {
|
268
|
-
mount(RCInputText, {
|
269
|
-
props: {
|
270
|
-
value: 'value test',
|
271
|
-
inputWidth: 200,
|
272
|
-
},
|
273
|
-
global: {
|
274
|
-
provide: {
|
275
|
-
theme,
|
276
|
-
},
|
277
|
-
},
|
278
|
-
})
|
279
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
280
|
-
})
|
281
|
-
it('validation of prop type - inputHeight - not String', async () => {
|
282
|
-
mount(RCInputText, {
|
283
|
-
props: {
|
284
|
-
value: 'value test',
|
285
|
-
inputHeight: 200,
|
286
|
-
},
|
287
|
-
global: {
|
288
|
-
provide: {
|
289
|
-
theme,
|
290
|
-
},
|
291
|
-
},
|
292
|
-
})
|
293
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
294
|
-
})
|
295
|
-
it('validation of prop type - minWidth - not String', async () => {
|
296
|
-
mount(RCInputText, {
|
297
|
-
props: {
|
298
|
-
value: 'value test',
|
299
|
-
minWidth: 200,
|
300
|
-
},
|
301
|
-
global: {
|
302
|
-
provide: {
|
303
|
-
theme,
|
304
|
-
},
|
305
|
-
},
|
306
|
-
})
|
307
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
308
|
-
})
|
309
|
-
it('validation of prop type - value - not String', async () => {
|
310
|
-
mount(RCInputText, {
|
311
|
-
props: {
|
312
|
-
value: 42,
|
313
|
-
},
|
314
|
-
global: {
|
315
|
-
provide: {
|
316
|
-
theme,
|
317
|
-
},
|
318
|
-
},
|
319
|
-
})
|
320
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
321
|
-
})
|
322
|
-
it('validation of prop type - errorMessage - not String', async () => {
|
323
|
-
mount(RCInputText, {
|
324
|
-
props: {
|
325
|
-
value: 'test value',
|
326
|
-
errorMessage: true,
|
327
|
-
},
|
328
|
-
global: {
|
329
|
-
provide: {
|
330
|
-
theme,
|
331
|
-
},
|
332
|
-
},
|
333
|
-
})
|
334
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
335
|
-
})
|
336
|
-
it('validation of prop type - infoTextMessage - not String', async () => {
|
337
|
-
mount(RCInputText, {
|
338
|
-
props: {
|
339
|
-
value: 'test value',
|
340
|
-
infoTextMessage: true,
|
341
|
-
},
|
342
|
-
global: {
|
343
|
-
provide: {
|
344
|
-
theme,
|
345
|
-
},
|
346
|
-
},
|
347
|
-
})
|
348
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
349
|
-
})
|
350
|
-
it('validation of prop type - infoTextAlign - not String', async () => {
|
351
|
-
mount(RCInputText, {
|
352
|
-
props: {
|
353
|
-
value: 'test value',
|
354
|
-
infoTextAlign: true,
|
355
|
-
},
|
356
|
-
global: {
|
357
|
-
provide: {
|
358
|
-
theme,
|
359
|
-
},
|
360
|
-
},
|
361
|
-
})
|
362
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
363
|
-
})
|
364
|
-
it('validation of prop type - label - not String', async () => {
|
365
|
-
mount(RCInputText, {
|
366
|
-
props: {
|
367
|
-
value: 'test value',
|
368
|
-
label: true,
|
369
|
-
},
|
370
|
-
global: {
|
371
|
-
provide: {
|
372
|
-
theme,
|
373
|
-
},
|
374
|
-
},
|
375
|
-
})
|
376
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
377
|
-
})
|
378
|
-
it('validation of prop type - labelOptional - not Boolean', async () => {
|
379
|
-
const wrapper = mount(RCInputText, {
|
380
|
-
props: {
|
381
|
-
value: 'test value',
|
382
|
-
labelOptional: 12,
|
383
|
-
label: 'label test',
|
384
|
-
},
|
385
|
-
global: {
|
386
|
-
provide: {
|
387
|
-
theme,
|
388
|
-
},
|
389
|
-
},
|
390
|
-
})
|
391
|
-
wrapper.vm.$gettext.mockReturnValue('Translated Message')
|
392
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
393
|
-
})
|
394
|
-
it('validation of prop type - noBorder - not Boolean', async () => {
|
395
|
-
mount(RCInputText, {
|
396
|
-
props: {
|
397
|
-
value: 'test value',
|
398
|
-
noBorder: 1,
|
399
|
-
},
|
400
|
-
global: {
|
401
|
-
provide: {
|
402
|
-
theme,
|
403
|
-
},
|
404
|
-
},
|
405
|
-
})
|
406
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
407
|
-
})
|
408
|
-
it('validation of prop type - disabled - not Boolean', async () => {
|
409
|
-
mount(RCInputText, {
|
410
|
-
props: {
|
411
|
-
disabled: 'false',
|
412
|
-
value: 'value test',
|
413
|
-
},
|
414
|
-
global: {
|
415
|
-
provide: {
|
416
|
-
theme,
|
417
|
-
},
|
418
|
-
},
|
419
|
-
})
|
420
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
421
|
-
})
|
422
|
-
it('validation of prop type - fontSize - not String', async () => {
|
423
|
-
mount(RCInputText, {
|
424
|
-
props: {
|
425
|
-
fontSize: true,
|
426
|
-
value: 'value test',
|
427
|
-
},
|
428
|
-
global: {
|
429
|
-
provide: {
|
430
|
-
theme,
|
431
|
-
},
|
432
|
-
},
|
433
|
-
})
|
434
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
435
|
-
})
|
436
|
-
it('validation of prop type - inputType - not String', async () => {
|
437
|
-
mount(RCInputText, {
|
438
|
-
props: {
|
439
|
-
inputType: true,
|
440
|
-
value: 'value test',
|
441
|
-
},
|
442
|
-
global: {
|
443
|
-
provide: {
|
444
|
-
theme,
|
445
|
-
},
|
446
|
-
},
|
447
|
-
})
|
448
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
449
|
-
})
|
450
|
-
it('validation of prop type - labelFontColor - not String', async () => {
|
451
|
-
mount(RCInputText, {
|
452
|
-
props: {
|
453
|
-
labelFontColor: true,
|
454
|
-
value: 'value test',
|
455
|
-
label: 'label text',
|
456
|
-
},
|
457
|
-
global: {
|
458
|
-
provide: {
|
459
|
-
theme,
|
460
|
-
},
|
461
|
-
},
|
462
|
-
})
|
463
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
464
|
-
})
|
465
|
-
it('validation of prop type - backgroundColor - not String', async () => {
|
466
|
-
mount(RCInputText, {
|
467
|
-
props: {
|
468
|
-
backgroundColor: true,
|
469
|
-
value: 'value test',
|
470
|
-
},
|
471
|
-
global: {
|
472
|
-
provide: {
|
473
|
-
theme,
|
474
|
-
},
|
475
|
-
},
|
476
|
-
})
|
477
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
478
|
-
})
|
479
|
-
it('validation of prop type - disabledBackgroundColor - not String', async () => {
|
480
|
-
mount(RCInputText, {
|
481
|
-
props: {
|
482
|
-
disabledBackgroundColor: true,
|
483
|
-
value: 'value test',
|
484
|
-
},
|
485
|
-
global: {
|
486
|
-
provide: {
|
487
|
-
theme,
|
488
|
-
},
|
489
|
-
},
|
490
|
-
})
|
491
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
492
|
-
})
|
493
|
-
it('validation of prop type - fontColor - not String', async () => {
|
494
|
-
mount(RCInputText, {
|
495
|
-
props: {
|
496
|
-
fontColor: true,
|
497
|
-
value: 'value test',
|
498
|
-
},
|
499
|
-
global: {
|
500
|
-
provide: {
|
501
|
-
theme,
|
502
|
-
},
|
503
|
-
},
|
504
|
-
})
|
505
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
506
|
-
})
|
507
|
-
it('validation of prop type - hasFocus - not Boolean', async () => {
|
508
|
-
mount(RCInputText, {
|
509
|
-
props: {
|
510
|
-
hasFocus: 'true',
|
511
|
-
value: 'value test',
|
512
|
-
},
|
513
|
-
global: {
|
514
|
-
provide: {
|
515
|
-
theme,
|
516
|
-
},
|
517
|
-
},
|
518
|
-
})
|
519
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
520
|
-
})
|
521
|
-
it('validation of prop type - borderColor - not String', async () => {
|
522
|
-
mount(RCInputText, {
|
523
|
-
props: {
|
524
|
-
borderColor: 42,
|
525
|
-
value: 'value test',
|
526
|
-
},
|
527
|
-
global: {
|
528
|
-
provide: {
|
529
|
-
theme,
|
530
|
-
},
|
531
|
-
},
|
532
|
-
})
|
533
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
534
|
-
})
|
535
|
-
it('validation of prop type - labelDataId - not String', async () => {
|
536
|
-
mount(RCInputText, {
|
537
|
-
props: {
|
538
|
-
labelDataId: 42,
|
539
|
-
value: 'value test',
|
540
|
-
},
|
541
|
-
global: {
|
542
|
-
provide: {
|
543
|
-
theme,
|
544
|
-
},
|
545
|
-
},
|
546
|
-
})
|
547
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
548
|
-
})
|
549
|
-
it('validation of prop type - inputDataId - not String', async () => {
|
550
|
-
mount(RCInputText, {
|
551
|
-
props: {
|
552
|
-
inputDataId: 42,
|
553
|
-
value: 'value test',
|
554
|
-
},
|
555
|
-
global: {
|
556
|
-
provide: {
|
557
|
-
theme,
|
558
|
-
},
|
559
|
-
},
|
560
|
-
})
|
561
|
-
expect(consoleWarnSpy).toHaveBeenCalled()
|
562
|
-
})
|
563
|
-
//Prop Updates: Verify that the component updates correctly when props change, reflecting new values in the rendered output.
|
564
|
-
it('update of prop hasFocus', async () => {
|
565
|
-
const wrapper = mount(RCInputText, {
|
566
|
-
props: {
|
567
|
-
value: 'value test',
|
568
|
-
hasFocus: false,
|
569
|
-
},
|
570
|
-
global: {
|
571
|
-
provide: {
|
572
|
-
theme,
|
573
|
-
},
|
574
|
-
},
|
575
|
-
})
|
576
|
-
const inputElement = wrapper.find('input').element
|
577
|
-
jest.spyOn(inputElement, 'focus').mockImplementation(() => {
|
578
|
-
// Simulate that the input element is now the focused element
|
579
|
-
Object.defineProperty(document, 'activeElement', {
|
580
|
-
value: inputElement,
|
581
|
-
configurable: true,
|
582
|
-
})
|
583
|
-
})
|
584
|
-
await wrapper.setProps({ hasFocus: true })
|
585
|
-
await wrapper.vm.$nextTick()
|
586
|
-
expect(document.activeElement).toBe(wrapper.find('input').element)
|
587
|
-
})
|
588
|
-
})
|
1
|
+
/* eslint-disable */
|
2
|
+
import { mount, Wrapper } from '@vue/test-utils'
|
3
|
+
import RCInputText from '@/components/inputs/inputText/index'
|
4
|
+
import theme from '@/assets/theme'
|
5
|
+
|
6
|
+
jest.mock('@/components/icon/iconCache.mjs', () => ({
|
7
|
+
// need to mock this due to how jest handles import.meta
|
8
|
+
fetchIcon: jest.fn(() => Promise.resolve('mocked-icon-url.svg')),
|
9
|
+
}))
|
10
|
+
|
11
|
+
const wrapper1 = mount(RCInputText, {
|
12
|
+
props: {
|
13
|
+
placeholder: 'placeholderText',
|
14
|
+
value: 'Test value',
|
15
|
+
label: 'Test label',
|
16
|
+
},
|
17
|
+
global: {
|
18
|
+
provide: {
|
19
|
+
theme,
|
20
|
+
},
|
21
|
+
},
|
22
|
+
})
|
23
|
+
const wrapperPassword = mount(RCInputText, {
|
24
|
+
props: {
|
25
|
+
placeholder: 'placeholderText',
|
26
|
+
value: 'Test value',
|
27
|
+
label: 'Test label',
|
28
|
+
inputType: 'password',
|
29
|
+
},
|
30
|
+
global: {
|
31
|
+
provide: {
|
32
|
+
theme,
|
33
|
+
},
|
34
|
+
},
|
35
|
+
})
|
36
|
+
describe('RCInputText.vue', () => {
|
37
|
+
let consoleWarnSpy
|
38
|
+
beforeEach(() => {
|
39
|
+
consoleWarnSpy = jest.spyOn(console, 'warn').mockImplementation(() => {})
|
40
|
+
})
|
41
|
+
afterEach(() => {
|
42
|
+
consoleWarnSpy.mockRestore()
|
43
|
+
})
|
44
|
+
// initial rendering
|
45
|
+
it('input is rendered', async () => {
|
46
|
+
const inputTextWrapper = wrapper1.find('[data-test-id="input_wrapper"]')
|
47
|
+
expect(inputTextWrapper.exists()).toBe(true)
|
48
|
+
})
|
49
|
+
// event management
|
50
|
+
it('input is rendered and emits inputChange when input event is triggered.', async () => {
|
51
|
+
const inputElement = wrapper1.find('input')
|
52
|
+
await inputElement.setValue('Test Input Value')
|
53
|
+
const emittedInputChangeEvent = wrapper1.emitted('input-change')
|
54
|
+
expect(emittedInputChangeEvent).toBeTruthy()
|
55
|
+
expect(emittedInputChangeEvent).toHaveLength(1) // Check if the event was emitted exactly once
|
56
|
+
expect(emittedInputChangeEvent[0]).toEqual(['Test Input Value'])
|
57
|
+
})
|
58
|
+
it('input emits on-enter-click', async () => {
|
59
|
+
const inputElement = wrapper1.find('input')
|
60
|
+
await inputElement.trigger('keyup.enter')
|
61
|
+
const emittedOnEnterClickEvent = wrapper1.emitted('on-enter-click')
|
62
|
+
expect(emittedOnEnterClickEvent).toBeTruthy()
|
63
|
+
expect(emittedOnEnterClickEvent).toHaveLength(1) // Check if the event was emitted exactly once
|
64
|
+
expect(emittedOnEnterClickEvent[0]).toEqual([]) // Check if the event was emitted exactly once
|
65
|
+
})
|
66
|
+
it('input emits on-blur', async () => {
|
67
|
+
const inputElement = wrapper1.find('input')
|
68
|
+
await inputElement.setValue('Test Input Value')
|
69
|
+
await inputElement.trigger('blur')
|
70
|
+
const emittedOnBlurEvent = wrapper1.emitted('input-blur')
|
71
|
+
expect(emittedOnBlurEvent).toBeTruthy()
|
72
|
+
expect(emittedOnBlurEvent).toHaveLength(1) // Check if the event was emitted exactly once
|
73
|
+
expect(emittedOnBlurEvent[0]).toEqual(['Test Input Value']) // Check if the event was emitted exactly once
|
74
|
+
})
|
75
|
+
it('input password visibility click trigger input type change', async () => {
|
76
|
+
const inputElement = wrapperPassword.find('input')
|
77
|
+
const passwordVisibilityIconElement = wrapperPassword.find(
|
78
|
+
'[data-test-id="password_visiblity_change_icon"]'
|
79
|
+
)
|
80
|
+
expect(passwordVisibilityIconElement.exists()).toBe(true)
|
81
|
+
await passwordVisibilityIconElement.trigger('click')
|
82
|
+
let inputType = inputElement.attributes().type
|
83
|
+
expect(inputType).toBe('text')
|
84
|
+
await passwordVisibilityIconElement.trigger('click')
|
85
|
+
inputType = inputElement.attributes().type
|
86
|
+
expect(inputType).toBe('password')
|
87
|
+
await passwordVisibilityIconElement.trigger('click')
|
88
|
+
inputType = inputElement.attributes().type
|
89
|
+
expect(inputType).toBe('text')
|
90
|
+
})
|
91
|
+
//Test conditional visibility
|
92
|
+
it('label visibility check', async () => {
|
93
|
+
const wrapper = mount(RCInputText, {
|
94
|
+
props: {
|
95
|
+
value: 'Test value',
|
96
|
+
label: 'Test label',
|
97
|
+
},
|
98
|
+
global: {
|
99
|
+
provide: {
|
100
|
+
theme,
|
101
|
+
},
|
102
|
+
},
|
103
|
+
})
|
104
|
+
const label = wrapper.find('[data-test-id="label_wrapper"]')
|
105
|
+
expect(label.exists()).toBe(true)
|
106
|
+
expect(label.text()).toContain('Test label')
|
107
|
+
})
|
108
|
+
it('label invisibility check', async () => {
|
109
|
+
const wrapper = mount(RCInputText, {
|
110
|
+
props: {
|
111
|
+
value: 'Test value',
|
112
|
+
},
|
113
|
+
global: {
|
114
|
+
provide: {
|
115
|
+
theme,
|
116
|
+
},
|
117
|
+
},
|
118
|
+
})
|
119
|
+
const label = wrapper.find('[data-test-id="label_wrapper"]')
|
120
|
+
expect(label.exists()).toBe(false)
|
121
|
+
})
|
122
|
+
it('label optional visibility check', async () => {
|
123
|
+
const wrapper = mount(RCInputText, {
|
124
|
+
props: {
|
125
|
+
value: 'Test value',
|
126
|
+
label: 'Test label',
|
127
|
+
labelOptional: true,
|
128
|
+
},
|
129
|
+
global: {
|
130
|
+
provide: {
|
131
|
+
theme,
|
132
|
+
},
|
133
|
+
},
|
134
|
+
})
|
135
|
+
const labelOptional = wrapper.find('[data-test-id="label_optional"]')
|
136
|
+
expect(labelOptional.exists()).toBe(true)
|
137
|
+
})
|
138
|
+
it('label optional invisibility check', async () => {
|
139
|
+
const wrapper = mount(RCInputText, {
|
140
|
+
props: {
|
141
|
+
value: 'Test value',
|
142
|
+
},
|
143
|
+
global: {
|
144
|
+
provide: {
|
145
|
+
theme,
|
146
|
+
},
|
147
|
+
},
|
148
|
+
})
|
149
|
+
const labelOptional = wrapper.find('[data-test-id="label_optional"]')
|
150
|
+
expect(labelOptional.exists()).toBe(false)
|
151
|
+
})
|
152
|
+
it('infoTextMessage visibility check', async () => {
|
153
|
+
const wrapper = mount(RCInputText, {
|
154
|
+
props: {
|
155
|
+
value: 'Test value',
|
156
|
+
infoTextMessage: 'infoTextMessage test',
|
157
|
+
label: 'Test label',
|
158
|
+
},
|
159
|
+
global: {
|
160
|
+
provide: {
|
161
|
+
theme,
|
162
|
+
},
|
163
|
+
},
|
164
|
+
})
|
165
|
+
const InfoTextMessage = wrapper.find('[data-test-id="info_text_message"]')
|
166
|
+
expect(InfoTextMessage.exists()).toBe(true)
|
167
|
+
})
|
168
|
+
it('infoTextMessage invibility check', async () => {
|
169
|
+
const wrapper = mount(RCInputText, {
|
170
|
+
props: {
|
171
|
+
value: 'Test value',
|
172
|
+
label: 'Test label',
|
173
|
+
},
|
174
|
+
global: {
|
175
|
+
provide: {
|
176
|
+
theme,
|
177
|
+
},
|
178
|
+
},
|
179
|
+
})
|
180
|
+
const InfoTextMessage = wrapper.find('[data-test-id="info_text_message"]')
|
181
|
+
expect(InfoTextMessage.exists()).toBe(false)
|
182
|
+
})
|
183
|
+
it('error visibility check', async () => {
|
184
|
+
const wrapper = mount(RCInputText, {
|
185
|
+
props: {
|
186
|
+
value: 'Test value',
|
187
|
+
isError: true,
|
188
|
+
errorMessage: 'Error message test',
|
189
|
+
label: 'Test label',
|
190
|
+
},
|
191
|
+
global: {
|
192
|
+
provide: {
|
193
|
+
theme,
|
194
|
+
},
|
195
|
+
},
|
196
|
+
})
|
197
|
+
const errorWrapper = wrapper.find('[data-test-id="error_wrapper"]')
|
198
|
+
const errorMessageWrapper = wrapper.find(
|
199
|
+
'[data-test-id="error_message_wrapper"]'
|
200
|
+
)
|
201
|
+
expect(errorWrapper.exists()).toBe(true)
|
202
|
+
expect(errorMessageWrapper.exists()).toBe(true)
|
203
|
+
expect(errorMessageWrapper.text()).toContain('Error message test')
|
204
|
+
})
|
205
|
+
it('error invibility check', async () => {
|
206
|
+
const wrapper = mount(RCInputText, {
|
207
|
+
props: {
|
208
|
+
value: 'Test value',
|
209
|
+
label: 'Test label',
|
210
|
+
},
|
211
|
+
global: {
|
212
|
+
provide: {
|
213
|
+
theme,
|
214
|
+
},
|
215
|
+
},
|
216
|
+
})
|
217
|
+
const errorWrapper = wrapper.find('[data-test-id="error_wrapper"]')
|
218
|
+
const errorMessageWrapper = wrapper.find(
|
219
|
+
'[data-test-id="error_message_wrapper"]'
|
220
|
+
)
|
221
|
+
expect(errorWrapper.exists()).toBe(false)
|
222
|
+
expect(errorMessageWrapper.exists()).toBe(false)
|
223
|
+
})
|
224
|
+
//Test that the component handles different prop types correctly and throws appropriate warnings for invalid props.
|
225
|
+
it('validation of prop type - placeholder - not String', async () => {
|
226
|
+
mount(RCInputText, {
|
227
|
+
props: {
|
228
|
+
placeholder: 42,
|
229
|
+
value: 'value test',
|
230
|
+
},
|
231
|
+
global: {
|
232
|
+
provide: {
|
233
|
+
theme,
|
234
|
+
},
|
235
|
+
},
|
236
|
+
})
|
237
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
238
|
+
})
|
239
|
+
it('validation of prop type - alignItems - not horizontal or vertical', async () => {
|
240
|
+
mount(RCInputText, {
|
241
|
+
props: {
|
242
|
+
value: 'value test',
|
243
|
+
alignItems: 'top',
|
244
|
+
},
|
245
|
+
global: {
|
246
|
+
provide: {
|
247
|
+
theme,
|
248
|
+
},
|
249
|
+
},
|
250
|
+
})
|
251
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
252
|
+
})
|
253
|
+
it('validation of prop type - isError - not Boolean', async () => {
|
254
|
+
mount(RCInputText, {
|
255
|
+
props: {
|
256
|
+
value: 'value test',
|
257
|
+
isError: 'true',
|
258
|
+
},
|
259
|
+
global: {
|
260
|
+
provide: {
|
261
|
+
theme,
|
262
|
+
},
|
263
|
+
},
|
264
|
+
})
|
265
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
266
|
+
})
|
267
|
+
it('validation of prop type - inputWidth - not String', async () => {
|
268
|
+
mount(RCInputText, {
|
269
|
+
props: {
|
270
|
+
value: 'value test',
|
271
|
+
inputWidth: 200,
|
272
|
+
},
|
273
|
+
global: {
|
274
|
+
provide: {
|
275
|
+
theme,
|
276
|
+
},
|
277
|
+
},
|
278
|
+
})
|
279
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
280
|
+
})
|
281
|
+
it('validation of prop type - inputHeight - not String', async () => {
|
282
|
+
mount(RCInputText, {
|
283
|
+
props: {
|
284
|
+
value: 'value test',
|
285
|
+
inputHeight: 200,
|
286
|
+
},
|
287
|
+
global: {
|
288
|
+
provide: {
|
289
|
+
theme,
|
290
|
+
},
|
291
|
+
},
|
292
|
+
})
|
293
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
294
|
+
})
|
295
|
+
it('validation of prop type - minWidth - not String', async () => {
|
296
|
+
mount(RCInputText, {
|
297
|
+
props: {
|
298
|
+
value: 'value test',
|
299
|
+
minWidth: 200,
|
300
|
+
},
|
301
|
+
global: {
|
302
|
+
provide: {
|
303
|
+
theme,
|
304
|
+
},
|
305
|
+
},
|
306
|
+
})
|
307
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
308
|
+
})
|
309
|
+
it('validation of prop type - value - not String', async () => {
|
310
|
+
mount(RCInputText, {
|
311
|
+
props: {
|
312
|
+
value: 42,
|
313
|
+
},
|
314
|
+
global: {
|
315
|
+
provide: {
|
316
|
+
theme,
|
317
|
+
},
|
318
|
+
},
|
319
|
+
})
|
320
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
321
|
+
})
|
322
|
+
it('validation of prop type - errorMessage - not String', async () => {
|
323
|
+
mount(RCInputText, {
|
324
|
+
props: {
|
325
|
+
value: 'test value',
|
326
|
+
errorMessage: true,
|
327
|
+
},
|
328
|
+
global: {
|
329
|
+
provide: {
|
330
|
+
theme,
|
331
|
+
},
|
332
|
+
},
|
333
|
+
})
|
334
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
335
|
+
})
|
336
|
+
it('validation of prop type - infoTextMessage - not String', async () => {
|
337
|
+
mount(RCInputText, {
|
338
|
+
props: {
|
339
|
+
value: 'test value',
|
340
|
+
infoTextMessage: true,
|
341
|
+
},
|
342
|
+
global: {
|
343
|
+
provide: {
|
344
|
+
theme,
|
345
|
+
},
|
346
|
+
},
|
347
|
+
})
|
348
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
349
|
+
})
|
350
|
+
it('validation of prop type - infoTextAlign - not String', async () => {
|
351
|
+
mount(RCInputText, {
|
352
|
+
props: {
|
353
|
+
value: 'test value',
|
354
|
+
infoTextAlign: true,
|
355
|
+
},
|
356
|
+
global: {
|
357
|
+
provide: {
|
358
|
+
theme,
|
359
|
+
},
|
360
|
+
},
|
361
|
+
})
|
362
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
363
|
+
})
|
364
|
+
it('validation of prop type - label - not String', async () => {
|
365
|
+
mount(RCInputText, {
|
366
|
+
props: {
|
367
|
+
value: 'test value',
|
368
|
+
label: true,
|
369
|
+
},
|
370
|
+
global: {
|
371
|
+
provide: {
|
372
|
+
theme,
|
373
|
+
},
|
374
|
+
},
|
375
|
+
})
|
376
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
377
|
+
})
|
378
|
+
it('validation of prop type - labelOptional - not Boolean', async () => {
|
379
|
+
const wrapper = mount(RCInputText, {
|
380
|
+
props: {
|
381
|
+
value: 'test value',
|
382
|
+
labelOptional: 12,
|
383
|
+
label: 'label test',
|
384
|
+
},
|
385
|
+
global: {
|
386
|
+
provide: {
|
387
|
+
theme,
|
388
|
+
},
|
389
|
+
},
|
390
|
+
})
|
391
|
+
wrapper.vm.$gettext.mockReturnValue('Translated Message')
|
392
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
393
|
+
})
|
394
|
+
it('validation of prop type - noBorder - not Boolean', async () => {
|
395
|
+
mount(RCInputText, {
|
396
|
+
props: {
|
397
|
+
value: 'test value',
|
398
|
+
noBorder: 1,
|
399
|
+
},
|
400
|
+
global: {
|
401
|
+
provide: {
|
402
|
+
theme,
|
403
|
+
},
|
404
|
+
},
|
405
|
+
})
|
406
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
407
|
+
})
|
408
|
+
it('validation of prop type - disabled - not Boolean', async () => {
|
409
|
+
mount(RCInputText, {
|
410
|
+
props: {
|
411
|
+
disabled: 'false',
|
412
|
+
value: 'value test',
|
413
|
+
},
|
414
|
+
global: {
|
415
|
+
provide: {
|
416
|
+
theme,
|
417
|
+
},
|
418
|
+
},
|
419
|
+
})
|
420
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
421
|
+
})
|
422
|
+
it('validation of prop type - fontSize - not String', async () => {
|
423
|
+
mount(RCInputText, {
|
424
|
+
props: {
|
425
|
+
fontSize: true,
|
426
|
+
value: 'value test',
|
427
|
+
},
|
428
|
+
global: {
|
429
|
+
provide: {
|
430
|
+
theme,
|
431
|
+
},
|
432
|
+
},
|
433
|
+
})
|
434
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
435
|
+
})
|
436
|
+
it('validation of prop type - inputType - not String', async () => {
|
437
|
+
mount(RCInputText, {
|
438
|
+
props: {
|
439
|
+
inputType: true,
|
440
|
+
value: 'value test',
|
441
|
+
},
|
442
|
+
global: {
|
443
|
+
provide: {
|
444
|
+
theme,
|
445
|
+
},
|
446
|
+
},
|
447
|
+
})
|
448
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
449
|
+
})
|
450
|
+
it('validation of prop type - labelFontColor - not String', async () => {
|
451
|
+
mount(RCInputText, {
|
452
|
+
props: {
|
453
|
+
labelFontColor: true,
|
454
|
+
value: 'value test',
|
455
|
+
label: 'label text',
|
456
|
+
},
|
457
|
+
global: {
|
458
|
+
provide: {
|
459
|
+
theme,
|
460
|
+
},
|
461
|
+
},
|
462
|
+
})
|
463
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
464
|
+
})
|
465
|
+
it('validation of prop type - backgroundColor - not String', async () => {
|
466
|
+
mount(RCInputText, {
|
467
|
+
props: {
|
468
|
+
backgroundColor: true,
|
469
|
+
value: 'value test',
|
470
|
+
},
|
471
|
+
global: {
|
472
|
+
provide: {
|
473
|
+
theme,
|
474
|
+
},
|
475
|
+
},
|
476
|
+
})
|
477
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
478
|
+
})
|
479
|
+
it('validation of prop type - disabledBackgroundColor - not String', async () => {
|
480
|
+
mount(RCInputText, {
|
481
|
+
props: {
|
482
|
+
disabledBackgroundColor: true,
|
483
|
+
value: 'value test',
|
484
|
+
},
|
485
|
+
global: {
|
486
|
+
provide: {
|
487
|
+
theme,
|
488
|
+
},
|
489
|
+
},
|
490
|
+
})
|
491
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
492
|
+
})
|
493
|
+
it('validation of prop type - fontColor - not String', async () => {
|
494
|
+
mount(RCInputText, {
|
495
|
+
props: {
|
496
|
+
fontColor: true,
|
497
|
+
value: 'value test',
|
498
|
+
},
|
499
|
+
global: {
|
500
|
+
provide: {
|
501
|
+
theme,
|
502
|
+
},
|
503
|
+
},
|
504
|
+
})
|
505
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
506
|
+
})
|
507
|
+
it('validation of prop type - hasFocus - not Boolean', async () => {
|
508
|
+
mount(RCInputText, {
|
509
|
+
props: {
|
510
|
+
hasFocus: 'true',
|
511
|
+
value: 'value test',
|
512
|
+
},
|
513
|
+
global: {
|
514
|
+
provide: {
|
515
|
+
theme,
|
516
|
+
},
|
517
|
+
},
|
518
|
+
})
|
519
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
520
|
+
})
|
521
|
+
it('validation of prop type - borderColor - not String', async () => {
|
522
|
+
mount(RCInputText, {
|
523
|
+
props: {
|
524
|
+
borderColor: 42,
|
525
|
+
value: 'value test',
|
526
|
+
},
|
527
|
+
global: {
|
528
|
+
provide: {
|
529
|
+
theme,
|
530
|
+
},
|
531
|
+
},
|
532
|
+
})
|
533
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
534
|
+
})
|
535
|
+
it('validation of prop type - labelDataId - not String', async () => {
|
536
|
+
mount(RCInputText, {
|
537
|
+
props: {
|
538
|
+
labelDataId: 42,
|
539
|
+
value: 'value test',
|
540
|
+
},
|
541
|
+
global: {
|
542
|
+
provide: {
|
543
|
+
theme,
|
544
|
+
},
|
545
|
+
},
|
546
|
+
})
|
547
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
548
|
+
})
|
549
|
+
it('validation of prop type - inputDataId - not String', async () => {
|
550
|
+
mount(RCInputText, {
|
551
|
+
props: {
|
552
|
+
inputDataId: 42,
|
553
|
+
value: 'value test',
|
554
|
+
},
|
555
|
+
global: {
|
556
|
+
provide: {
|
557
|
+
theme,
|
558
|
+
},
|
559
|
+
},
|
560
|
+
})
|
561
|
+
expect(consoleWarnSpy).toHaveBeenCalled()
|
562
|
+
})
|
563
|
+
//Prop Updates: Verify that the component updates correctly when props change, reflecting new values in the rendered output.
|
564
|
+
it('update of prop hasFocus', async () => {
|
565
|
+
const wrapper = mount(RCInputText, {
|
566
|
+
props: {
|
567
|
+
value: 'value test',
|
568
|
+
hasFocus: false,
|
569
|
+
},
|
570
|
+
global: {
|
571
|
+
provide: {
|
572
|
+
theme,
|
573
|
+
},
|
574
|
+
},
|
575
|
+
})
|
576
|
+
const inputElement = wrapper.find('input').element
|
577
|
+
jest.spyOn(inputElement, 'focus').mockImplementation(() => {
|
578
|
+
// Simulate that the input element is now the focused element
|
579
|
+
Object.defineProperty(document, 'activeElement', {
|
580
|
+
value: inputElement,
|
581
|
+
configurable: true,
|
582
|
+
})
|
583
|
+
})
|
584
|
+
await wrapper.setProps({ hasFocus: true })
|
585
|
+
await wrapper.vm.$nextTick()
|
586
|
+
expect(document.activeElement).toBe(wrapper.find('input').element)
|
587
|
+
})
|
588
|
+
})
|