WIP: #7220 - Component Unit Cypress Test #296
|
@ -1,7 +1,7 @@
|
||||||
const { defineConfig } = require('cypress');
|
const { defineConfig } = require('cypress');
|
||||||
const {
|
// const {
|
||||||
injectQuasarDevServerConfig,
|
// injectQuasarDevServerConfig,
|
||||||
} = require('@quasar/quasar-app-extension-testing-e2e-cypress/cct-dev-server');
|
// } = require('@quasar/quasar-app-extension-testing-e2e-cypress/cct-dev-server');
|
||||||
|
|
||||||
module.exports = defineConfig({
|
module.exports = defineConfig({
|
||||||
env: {
|
env: {
|
||||||
|
|
|
@ -44,7 +44,7 @@
|
||||||
"@quasar/quasar-app-extension-qcalendar": "4.0.0-beta.15",
|
"@quasar/quasar-app-extension-qcalendar": "4.0.0-beta.15",
|
||||||
"@quasar/quasar-app-extension-testing-e2e-cypress": "^6.1.0",
|
"@quasar/quasar-app-extension-testing-e2e-cypress": "^6.1.0",
|
||||||
"@quasar/quasar-app-extension-testing-unit-vitest": "^0.4.0",
|
"@quasar/quasar-app-extension-testing-unit-vitest": "^0.4.0",
|
||||||
"@vitest/ui": "^1.6.0",
|
"@vitest/ui": "^2.1.4",
|
||||||
"@vue/test-utils": "^2.4.4",
|
"@vue/test-utils": "^2.4.4",
|
||||||
"autoprefixer": "^10.4.14",
|
"autoprefixer": "^10.4.14",
|
||||||
"cypress": "^13.6.6",
|
"cypress": "^13.6.6",
|
||||||
|
@ -55,7 +55,7 @@
|
||||||
"husky": "^8.0.0",
|
"husky": "^8.0.0",
|
||||||
"postcss": "^8.4.23",
|
"postcss": "^8.4.23",
|
||||||
"prettier": "^2.8.8",
|
"prettier": "^2.8.8",
|
||||||
"vitest": "^0.31.1"
|
"vitest": "^0.31.4"
|
||||||
},
|
},
|
||||||
"engines": {
|
"engines": {
|
||||||
"node": "^20 || ^18 || ^16",
|
"node": "^20 || ^18 || ^16",
|
||||||
|
|
2493
pnpm-lock.yaml
2493
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
|
@ -2,13 +2,13 @@
|
||||||
import { reactive, ref, watch } from 'vue';
|
import { reactive, ref, watch } from 'vue';
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
|
|
||||||
import FetchData from 'components/FetchData.vue';
|
import FetchData from 'src/components/FetchData.vue';
|
||||||
import VnRow from 'components/ui/VnRow.vue';
|
import VnRow from 'src/components/ui/VnRow.vue';
|
||||||
import VnSelect from 'src/components/common/VnSelect.vue';
|
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||||
import VnSelectProvince from 'src/components/VnSelectProvince.vue';
|
import VnSelectProvince from 'src/components/VnSelectProvince.vue';
|
||||||
import VnInput from 'src/components/common/VnInput.vue';
|
import VnInput from 'src/components/common/VnInput.vue';
|
||||||
import CreateNewCityForm from './CreateNewCityForm.vue';
|
import CreateNewCityForm from './CreateNewCityForm.vue';
|
||||||
import VnSelectDialog from 'components/common/VnSelectDialog.vue';
|
import VnSelectDialog from 'src/components/common/VnSelectDialog.vue';
|
||||||
import FormModelPopup from './FormModelPopup.vue';
|
import FormModelPopup from './FormModelPopup.vue';
|
||||||
|
|
||||||
const emit = defineEmits(['onDataSaved']);
|
const emit = defineEmits(['onDataSaved']);
|
||||||
|
|
|
@ -7,6 +7,9 @@ import VnSelectDialog from 'src/components/common/VnSelectDialog.vue';
|
||||||
import FetchData from 'src/components/FetchData.vue';
|
import FetchData from 'src/components/FetchData.vue';
|
||||||
import CreateNewProvinceForm from './CreateNewProvinceForm.vue';
|
import CreateNewProvinceForm from './CreateNewProvinceForm.vue';
|
||||||
|
|
||||||
|
const { validate } = useValidator();
|
||||||
|
const { t } = useI18n();
|
||||||
|
|
||||||
const emit = defineEmits(['onProvinceCreated']);
|
const emit = defineEmits(['onProvinceCreated']);
|
||||||
const $props = defineProps({
|
const $props = defineProps({
|
||||||
countryFk: {
|
countryFk: {
|
||||||
|
@ -24,9 +27,6 @@ const $props = defineProps({
|
||||||
});
|
});
|
||||||
const provinceFk = defineModel({ type: Number, default: null });
|
const provinceFk = defineModel({ type: Number, default: null });
|
||||||
|
|
||||||
const { validate } = useValidator();
|
|
||||||
const { t } = useI18n();
|
|
||||||
|
|
||||||
const provincesOptions = ref($props.provinces);
|
const provincesOptions = ref($props.provinces);
|
||||||
provinceFk.value = $props.provinceSelected;
|
provinceFk.value = $props.provinceSelected;
|
||||||
const provincesFetchDataRef = ref();
|
const provincesFetchDataRef = ref();
|
||||||
|
@ -81,5 +81,5 @@ async function handleProvinces(data) {
|
||||||
<i18n lang="yml">
|
<i18n lang="yml">
|
||||||
es:
|
es:
|
||||||
Province: Provincia
|
Province: Provincia
|
||||||
Create province: Crear provincia
|
Create province: Crear provincia
|
||||||
</i18n>
|
</i18n>
|
||||||
|
|
|
@ -2,6 +2,8 @@
|
||||||
import { computed, ref } from 'vue';
|
import { computed, ref } from 'vue';
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
import { useValidator } from 'src/composables/useValidator';
|
import { useValidator } from 'src/composables/useValidator';
|
||||||
|
import { useAttrs } from 'vue';
|
||||||
|
const $attrs = useAttrs();
|
||||||
|
|
||||||
const emit = defineEmits([
|
const emit = defineEmits([
|
||||||
'update:modelValue',
|
'update:modelValue',
|
||||||
|
@ -57,12 +59,6 @@ const focus = () => {
|
||||||
vnInputRef.value.focus();
|
vnInputRef.value.focus();
|
||||||
};
|
};
|
||||||
|
|
||||||
defineExpose({
|
|
||||||
focus,
|
|
||||||
});
|
|
||||||
import { useAttrs } from 'vue';
|
|
||||||
const $attrs = useAttrs();
|
|
||||||
|
|
||||||
const mixinRules = [
|
const mixinRules = [
|
||||||
requiredFieldRule,
|
requiredFieldRule,
|
||||||
...($attrs.rules ?? []),
|
...($attrs.rules ?? []),
|
||||||
|
@ -76,11 +72,39 @@ const mixinRules = [
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
defineExpose({
|
||||||
|
focus,
|
||||||
|
});
|
||||||
|
const isInsertMode = ref(false);
|
||||||
|
|
||||||
|
const handleKeydown = (event) => {
|
||||||
|
const qInputEl = vnInputRef.value.$el.querySelector('input');
|
||||||
|
const cursorPos = qInputEl.selectionStart;
|
||||||
|
|
||||||
|
if (event.key === 'Insert') {
|
||||||
|
isInsertMode.value = !isInsertMode.value;
|
||||||
|
} else if (isInsertMode.value && !isNaN(event.key) && event.key.length === 1) {
|
||||||
|
event.preventDefault();
|
||||||
|
const currentValue = value.value;
|
||||||
|
if (cursorPos !== null) {
|
||||||
|
const newValue =
|
||||||
|
currentValue.slice(0, cursorPos) +
|
||||||
|
event.key +
|
||||||
|
currentValue.slice(cursorPos + 1);
|
||||||
|
value.value = newValue;
|
||||||
|
|
||||||
|
setTimeout(() => {
|
||||||
|
qInputEl.setSelectionRange(cursorPos + 1, cursorPos + 1);
|
||||||
|
}, 0);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div @mouseover="hover = true" @mouseleave="hover = false">
|
<div @mouseover="hover = true" @mouseleave="hover = false">
|
||||||
<QInput
|
<QInput
|
||||||
|
@keydown="handleKeydown"
|
||||||
ref="vnInputRef"
|
ref="vnInputRef"
|
||||||
v-model="value"
|
v-model="value"
|
||||||
v-bind="{ ...$attrs, ...styleAttrs }"
|
v-bind="{ ...$attrs, ...styleAttrs }"
|
||||||
|
|
|
@ -14,7 +14,7 @@ const props = defineProps({
|
||||||
});
|
});
|
||||||
|
|
||||||
const locationProperties = [
|
const locationProperties = [
|
||||||
'postcode',
|
'posstcode',
|
||||||
(obj) =>
|
(obj) =>
|
||||||
obj.city
|
obj.city
|
||||||
? `${obj.city}${obj.province?.name ? `(${obj.province.name})` : ''}`
|
? `${obj.city}${obj.province?.name ? `(${obj.province.name})` : ''}`
|
||||||
|
|
|
@ -51,7 +51,8 @@ const val = computed(() => $props.value);
|
||||||
</div>
|
</div>
|
||||||
<div class="info" v-if="info">
|
<div class="info" v-if="info">
|
||||||
<QIcon name="info" class="cursor-pointer" size="xs" color="grey">
|
<QIcon name="info" class="cursor-pointer" size="xs" color="grey">
|
||||||
<QTooltip class="bg-dark text-white shadow-4" :offset="[10, 10]">
|
{{ info }}
|
||||||
|
<QTooltip class="bg-dark text-white shadow-4">
|
||||||
{{ info }}
|
{{ info }}
|
||||||
</QTooltip>
|
</QTooltip>
|
||||||
</QIcon>
|
</QIcon>
|
||||||
|
|
|
@ -7,9 +7,9 @@ import { useRoute } from 'vue-router';
|
||||||
import { useStateStore } from 'stores/useStateStore';
|
import { useStateStore } from 'stores/useStateStore';
|
||||||
import { useArrayData } from 'composables/useArrayData';
|
import { useArrayData } from 'composables/useArrayData';
|
||||||
import { toDate, toCurrency, toPercentage } from 'filters/index';
|
import { toDate, toCurrency, toPercentage } from 'filters/index';
|
||||||
import CrudModel from 'components/CrudModel.vue';
|
import CrudModel from 'src/components/CrudModel.vue';
|
||||||
import FetchData from 'components/FetchData.vue';
|
import FetchData from 'src/components/FetchData.vue';
|
||||||
import VnDiscount from 'components/common/vnDiscount.vue';
|
import VnDiscount from 'src/components/common/vnDiscount.vue';
|
||||||
import ClaimLinesImport from './ClaimLinesImport.vue';
|
import ClaimLinesImport from './ClaimLinesImport.vue';
|
||||||
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
|
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
|
||||||
|
|
||||||
|
|
|
@ -85,7 +85,12 @@ function handleLocation(data, location) {
|
||||||
<QCheckbox :label="t('Default')" v-model="data.isDefaultAddress" />
|
<QCheckbox :label="t('Default')" v-model="data.isDefaultAddress" />
|
||||||
|
|
||||||
<VnRow>
|
<VnRow>
|
||||||
<VnInput :label="t('Consignee')" clearable v-model="data.nickname" />
|
<VnInput
|
||||||
|
:label="t('Consignee')"
|
||||||
|
clearable
|
||||||
|
v-model="data.nickname"
|
||||||
|
required
|
||||||
|
/>
|
||||||
|
|
||||||
<VnInput :label="t('Street address')" clearable v-model="data.street" />
|
<VnInput :label="t('Street address')" clearable v-model="data.street" />
|
||||||
</VnRow>
|
</VnRow>
|
||||||
|
|
|
@ -8,7 +8,7 @@ import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||||
import RightMenu from 'src/components/common/RightMenu.vue';
|
import RightMenu from 'src/components/common/RightMenu.vue';
|
||||||
import VnTable from 'src/components/VnTable/VnTable.vue';
|
import VnTable from 'src/components/VnTable/VnTable.vue';
|
||||||
import EntryLatestBuysFilter from './EntryLatestBuysFilter.vue';
|
import EntryLatestBuysFilter from './EntryLatestBuysFilter.vue';
|
||||||
import VnTable from 'components/VnTable/VnTable.vue';
|
import VnTable from 'src/components/VnTable/VnTable.vue';
|
||||||
import VnImg from 'src/components/ui/VnImg.vue';
|
import VnImg from 'src/components/ui/VnImg.vue';
|
||||||
|
|
||||||
const stateStore = useStateStore();
|
const stateStore = useStateStore();
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, computed, watch } from 'vue';
|
import { ref, computed, watch } from 'vue';
|
||||||
import VnInputDate from 'components/common/VnInputDate.vue';
|
import VnInputDate from 'src/components/common/VnInputDate.vue';
|
||||||
import useNotify from 'src/composables/useNotify.js';
|
import useNotify from 'src/composables/useNotify.js';
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
|
|
||||||
|
|
|
@ -9,7 +9,7 @@ import { useArrayData } from 'src/composables/useArrayData';
|
||||||
import CustomerDescriptorProxy from '../Customer/Card/CustomerDescriptorProxy.vue';
|
import CustomerDescriptorProxy from '../Customer/Card/CustomerDescriptorProxy.vue';
|
||||||
import TicketDescriptorProxy from '../Ticket/Card/TicketDescriptorProxy.vue';
|
import TicketDescriptorProxy from '../Ticket/Card/TicketDescriptorProxy.vue';
|
||||||
import WorkerDescriptorProxy from '../Worker/Card/WorkerDescriptorProxy.vue';
|
import WorkerDescriptorProxy from '../Worker/Card/WorkerDescriptorProxy.vue';
|
||||||
import VnInputDate from 'components/common/VnInputDate.vue';
|
import VnInputDate from 'src/components/common/VnInputDate.vue';
|
||||||
|
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
const tableRef = ref();
|
const tableRef = ref();
|
||||||
|
|
|
@ -14,8 +14,8 @@ import RouteSummary from 'pages/Route/Card/RouteSummary.vue';
|
||||||
import RightMenu from 'src/components/common/RightMenu.vue';
|
import RightMenu from 'src/components/common/RightMenu.vue';
|
||||||
import RouteFilter from 'pages/Route/Card/RouteFilter.vue';
|
import RouteFilter from 'pages/Route/Card/RouteFilter.vue';
|
||||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||||
import VnInputDate from 'components/common/VnInputDate.vue';
|
import VnInputDate from 'src/components/common/VnInputDate.vue';
|
||||||
import VnTable from 'components/VnTable/VnTable.vue';
|
import VnTable from 'src/components/VnTable/VnTable.vue';
|
||||||
|
|
||||||
const { openReport } = usePrintService();
|
const { openReport } = usePrintService();
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
|
|
|
@ -104,6 +104,7 @@ function handleLocation(data, location) {
|
||||||
v-model="data.account"
|
v-model="data.account"
|
||||||
:label="t('supplier.fiscalData.account')"
|
:label="t('supplier.fiscalData.account')"
|
||||||
clearable
|
clearable
|
||||||
|
:max-length="10"
|
||||||
/>
|
/>
|
||||||
<VnSelect
|
<VnSelect
|
||||||
:label="t('supplier.fiscalData.sageTaxTypeFk')"
|
:label="t('supplier.fiscalData.sageTaxTypeFk')"
|
||||||
|
|
|
@ -9,9 +9,9 @@ import SendEmailDialog from 'src/components/common/SendEmailDialog.vue';
|
||||||
import VnConfirm from 'src/components/ui/VnConfirm.vue';
|
import VnConfirm from 'src/components/ui/VnConfirm.vue';
|
||||||
import VnSmsDialog from 'src/components/common/VnSmsDialog.vue';
|
import VnSmsDialog from 'src/components/common/VnSmsDialog.vue';
|
||||||
import toDate from 'filters/toDate';
|
import toDate from 'filters/toDate';
|
||||||
import FormPopup from 'components/FormPopup.vue';
|
import FormPopup from 'src/components/FormPopup.vue';
|
||||||
import VnSelect from 'components/common/VnSelect.vue';
|
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||||
import FetchData from 'components/FetchData.vue';
|
import FetchData from 'src/components/FetchData.vue';
|
||||||
import VnInputTime from 'src/components/common/VnInputTime.vue';
|
import VnInputTime from 'src/components/common/VnInputTime.vue';
|
||||||
import { useAcl } from 'src/composables/useAcl';
|
import { useAcl } from 'src/composables/useAcl';
|
||||||
import VnInputNumber from 'src/components/common/VnInputNumber.vue';
|
import VnInputNumber from 'src/components/common/VnInputNumber.vue';
|
||||||
|
|
|
@ -2,11 +2,11 @@
|
||||||
import { ref } from 'vue';
|
import { ref } from 'vue';
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
|
|
||||||
import FetchData from 'components/FetchData.vue';
|
import FetchData from 'src/components/FetchData.vue';
|
||||||
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
|
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
|
||||||
import VnSelect from 'components/common/VnSelect.vue';
|
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||||
import VnInput from 'src/components/common/VnInput.vue';
|
import VnInput from 'src/components/common/VnInput.vue';
|
||||||
import VnInputDate from 'components/common/VnInputDate.vue';
|
import VnInputDate from 'src/components/common/VnInputDate.vue';
|
||||||
import VnInputTime from 'src/components/common/VnInputTime.vue';
|
import VnInputTime from 'src/components/common/VnInputTime.vue';
|
||||||
|
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
|
|
|
@ -2,11 +2,11 @@
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
import { useRoute } from 'vue-router';
|
import { useRoute } from 'vue-router';
|
||||||
import { ref, computed } from 'vue';
|
import { ref, computed } from 'vue';
|
||||||
import FetchData from 'components/FetchData.vue';
|
import FetchData from 'src/components/FetchData.vue';
|
||||||
import VnRow from 'components/ui/VnRow.vue';
|
import VnRow from 'src/components/ui/VnRow.vue';
|
||||||
import VnSelect from 'src/components/common/VnSelect.vue';
|
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||||
import VnInput from 'src/components/common/VnInput.vue';
|
import VnInput from 'src/components/common/VnInput.vue';
|
||||||
import CrudModel from 'components/CrudModel.vue';
|
import CrudModel from 'src/components/CrudModel.vue';
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
|
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
/// <reference types="cypress" />
|
||||||
import { createTestingPinia } from '@pinia/testing';
|
import { createTestingPinia } from '@pinia/testing';
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
import { setActivePinia } from 'pinia';
|
import { setActivePinia } from 'pinia';
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
/// <reference types="cypress" />
|
||||||
import CreateManualInvoiceForm from 'src/components/CreateManualInvoiceForm.vue';
|
import CreateManualInvoiceForm from 'src/components/CreateManualInvoiceForm.vue';
|
||||||
|
|
||||||
describe.skip('<CreateManualInvoiceForm />', () => {
|
describe.skip('<CreateManualInvoiceForm />', () => {
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
/// <reference types="cypress" />
|
||||||
import CreateNewCityForm from 'src/components/CreateNewCityForm.vue';
|
import CreateNewCityForm from 'src/components/CreateNewCityForm.vue';
|
||||||
|
|
||||||
describe.skip('<CreateNewCityForm />', () => {
|
describe.skip('<CreateNewCityForm />', () => {
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
/// <reference types="cypress" />
|
||||||
import CreateNewExpenseForm from 'src/components/CreateNewExpenseForm.vue';
|
import CreateNewExpenseForm from 'src/components/CreateNewExpenseForm.vue';
|
||||||
|
|
||||||
describe.skip('<CreateNewExpenseForm />', () => {
|
describe.skip('<CreateNewExpenseForm />', () => {
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
/// <reference types="cypress" />
|
||||||
import CreateNewPostcodeForm from 'src/components/CreateNewPostcodeForm.vue';
|
import CreateNewPostcodeForm from 'src/components/CreateNewPostcodeForm.vue';
|
||||||
|
|
||||||
describe.skip('<CreateNewPostcodeForm />', () => {
|
describe.skip('<CreateNewPostcodeForm />', () => {
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import CreateNewProvinceForm from 'src/components/CreateNewProvinceForm.vue';
|
import CreateNewProvinceForm from 'src/components/CreateNewProvinceForm.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<CreateNewProvinceForm />', () => {
|
describe.skip('<CreateNewProvinceForm />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import CreateThermographForm from 'src/components/CreateThermographForm.vue';
|
import CreateThermographForm from 'src/components/CreateThermographForm.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<CreateThermographForm />', () => {
|
describe.skip('<CreateThermographForm />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
/// <reference types="cypress" />
|
||||||
import FormPopup from 'src/components/FormPopup.vue';
|
import FormPopup from 'src/components/FormPopup.vue';
|
||||||
|
|
||||||
describe.skip('<FormPopup />', () => {
|
describe.skip('<FormPopup />', () => {
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
/// <reference types="cypress" />
|
||||||
import ItemsFilterPanel from 'src/components/ItemsFilterPanel.vue';
|
import ItemsFilterPanel from 'src/components/ItemsFilterPanel.vue';
|
||||||
|
|
||||||
describe.skip('<ItemsFilterPanel />', () => {
|
describe.skip('<ItemsFilterPanel />', () => {
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import PinnedModules from 'src/components/PinnedModules.vue';
|
import PinnedModules from 'src/components/PinnedModules.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<PinnedModules />', () => {
|
describe.skip('<PinnedModules />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import RefundInvoiceForm from 'src/components/RefundInvoiceForm.vue';
|
import RefundInvoiceForm from 'src/components/RefundInvoiceForm.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<RefundInvoiceForm />', () => {
|
describe.skip('<RefundInvoiceForm />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import RegularizeStockForm from 'src/components/RegularizeStockForm.vue';
|
import RegularizeStockForm from 'src/components/RegularizeStockForm.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<RegularizeStockForm />', () => {
|
describe.skip('<RegularizeStockForm />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import TransferInvoiceForm from 'src/components/TransferInvoiceForm.vue';
|
import TransferInvoiceForm from 'src/components/TransferInvoiceForm.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<TransferInvoiceForm />', () => {
|
describe.skip('<TransferInvoiceForm />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import UserPanel from 'src/components/UserPanel.vue';
|
import UserPanel from 'src/components/UserPanel.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<UserPanel />', () => {
|
describe.skip('<UserPanel />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import RightMenu from 'src/components/common/RightMenu.vue';
|
import RightMenu from 'src/components/common/RightMenu.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<RightMenu />', () => {
|
describe.skip('<RightMenu />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import SendEmailDialog from 'src/components/common/SendEmailDialog.vue';
|
import SendEmailDialog from 'src/components/common/SendEmailDialog.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe('<SendEmailDialog />', () => {
|
describe('<SendEmailDialog />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import SendSmsDialog from 'src/components/common/SendSmsDialog.vue';
|
import SendSmsDialog from 'src/components/common/SendSmsDialog.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<SendSmsDialog />', () => {
|
describe.skip('<SendSmsDialog />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import TableVisibleColumns from 'src/components/common/TableVisibleColumns.vue';
|
import TableVisibleColumns from 'src/components/common/TableVisibleColumns.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<TableVisibleColumns />', () => {
|
describe.skip('<TableVisibleColumns />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnAccountNumber from 'src/components/common/VnAccountNumber.vue';
|
import VnAccountNumber from 'src/components/common/VnAccountNumber.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnAccountNumber />', () => {
|
describe.skip('<VnAccountNumber />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnBreadcrumbs from 'src/components/common/VnBreadcrumbs.vue';
|
import VnBreadcrumbs from 'src/components/common/VnBreadcrumbs.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnBreadcrumbs />', () => {
|
describe.skip('<VnBreadcrumbs />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnCard from 'src/components/common/VnCard.vue';
|
import VnCard from 'src/components/common/VnCard.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnCard />', () => {
|
describe.skip('<VnCard />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnComponent from 'src/components/common/VnComponent.vue';
|
import VnComponent from 'src/components/common/VnComponent.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnComponent />', () => {
|
describe.skip('<VnComponent />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnDms from 'src/components/common/VnDms.vue';
|
import VnDms from 'src/components/common/VnDms.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnDms />', () => {
|
describe.skip('<VnDms />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnDmsList from 'src/components/common/VnDmsList.vue';
|
import VnDmsList from 'src/components/common/VnDmsList.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnDmsList />', () => {
|
describe.skip('<VnDmsList />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnInput from 'src/components/common/VnInput.vue';
|
import VnInput from 'src/components/common/VnInput.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnInput />', () => {
|
describe.skip('<VnInput />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnInputDate from 'src/components/common/VnInputDate.vue';
|
import VnInputDate from 'src/components/common/VnInputDate.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnInputDate />', () => {
|
describe.skip('<VnInputDate />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnInputNumber from 'src/components/common/VnInputNumber.vue';
|
import VnInputNumber from 'src/components/common/VnInputNumber.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnInputNumber />', () => {
|
describe.skip('<VnInputNumber />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnInputTime from 'src/components/common/VnInputTime.vue';
|
import VnInputTime from 'src/components/common/VnInputTime.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnInputTime />', () => {
|
describe.skip('<VnInputTime />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,8 +1,55 @@
|
||||||
|
/// <reference types="cypress" />
|
||||||
import VnJsonValue from 'src/components/common/VnJsonValue.vue';
|
import VnJsonValue from 'src/components/common/VnJsonValue.vue';
|
||||||
|
|
||||||
describe.skip('<VnJsonValue />', () => {
|
describe('<VnJsonValue />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
const mountComponent = (value) => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
cy.createWrapper(VnJsonValue, { props: { value } });
|
||||||
cy.createWrapper(VnJsonValue);
|
};
|
||||||
|
|
||||||
|
it('renders null value correctly', () => {
|
||||||
|
mountComponent(null);
|
||||||
|
cy.get('span').should('have.class', 'json-null').and('contain', '∅');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders number value correctly', () => {
|
||||||
|
mountComponent(123.456);
|
||||||
|
cy.get('span').should('have.class', 'json-number').and('contain', '123.456');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders boolean value correctly', () => {
|
||||||
|
mountComponent(true);
|
||||||
|
cy.get('span').should('have.class', 'json-true').and('contain', '✓');
|
||||||
|
|
||||||
|
mountComponent(false);
|
||||||
|
cy.get('span').should('have.class', 'json-false').and('contain', '✗');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders string value correctly', () => {
|
||||||
|
mountComponent('Hello, World!');
|
||||||
|
cy.get('span')
|
||||||
|
.should('have.class', 'json-string')
|
||||||
|
.and('contain', 'Hello, World!');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders truncated string value correctly', () => {
|
||||||
|
const longString = 'a'.repeat(513);
|
||||||
|
mountComponent(longString);
|
||||||
|
cy.get('span')
|
||||||
|
.should('have.class', 'json-string')
|
||||||
|
.and('contain', 'a'.repeat(512) + '...');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders date value correctly', () => {
|
||||||
|
const date = new Date('2023-01-01T00:00:00Z');
|
||||||
|
mountComponent(date);
|
||||||
|
cy.get('span').should('have.class', 'json-object').and('contain', '2023-01-01');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders object value correctly', () => {
|
||||||
|
const obj = { key: 'value' };
|
||||||
|
mountComponent(obj);
|
||||||
|
cy.get('span')
|
||||||
|
.should('have.class', 'json-object')
|
||||||
|
.and('contain', '[object Object]');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -1,17 +1,75 @@
|
||||||
|
/// <reference types="cypress" />
|
||||||
import VnLocation from 'src/components/common/VnLocation.vue';
|
import VnLocation from 'src/components/common/VnLocation.vue';
|
||||||
describe.skip('<VnLocation />', () => {
|
describe.skip('<VnLocation />', () => {
|
||||||
it('renders', () => {
|
const location = {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
postcode: '46000',
|
||||||
cy.createWrapper(VnLocation, {
|
city: 'Valencia',
|
||||||
props: {
|
province: { name: 'Province one' },
|
||||||
modelValue: 1234,
|
country: { name: 'España' },
|
||||||
location: {
|
};
|
||||||
postcode: '46600',
|
const defaultComponent = {
|
||||||
city: ' Alz',
|
props: {
|
||||||
province: { name: 'as' },
|
modelValue: 1234,
|
||||||
country: { name: 'asdq' },
|
location,
|
||||||
},
|
},
|
||||||
|
};
|
||||||
|
const mountComponent = (obj = defaultComponent) => {
|
||||||
|
cy.createWrapper(VnLocation, obj);
|
||||||
|
};
|
||||||
|
|
||||||
|
it('renders with default props', () => {
|
||||||
|
mountComponent();
|
||||||
|
cy.get('.q-field__label').should('contain', 'Location');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders with location prop', () => {
|
||||||
|
mountComponent();
|
||||||
|
cy.get('.q-field__label').should('contain', 'Location');
|
||||||
|
cy.get('.q-field__native').should(
|
||||||
|
'have.value',
|
||||||
|
'46000, Valencia(Province one), España'
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('opens select dialog on click', () => {
|
||||||
|
mountComponent();
|
||||||
|
cy.get('.q-field__native').click();
|
||||||
|
cy.get('.q-dialog').should('be.visible');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders options correctly', () => {
|
||||||
|
const options = [
|
||||||
|
{
|
||||||
|
code: '46000',
|
||||||
|
town: 'Valencia',
|
||||||
|
province: 'Province one',
|
||||||
|
country: 'España',
|
||||||
},
|
},
|
||||||
|
];
|
||||||
|
mountComponent();
|
||||||
|
cy.get('.q-field__native').click();
|
||||||
|
cy.get('.q-item').should('have.length', options.length);
|
||||||
|
cy.get('.q-item').first().should('contain', '46000');
|
||||||
|
cy.get('.q-item').first().should('contain', 'Valencia(Province one)');
|
||||||
|
cy.get('.q-item').first().should('contain', 'España');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('emits update:model-value on selection', () => {
|
||||||
|
mountComponent();
|
||||||
|
cy.get('.q-field__native').click();
|
||||||
|
cy.get('.q-item').first().click();
|
||||||
|
cy.wrap(Cypress.vueWrapper.emitted('update:model-value')).should(
|
||||||
|
'have.length',
|
||||||
|
1
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders CreateNewPostcode form', () => {
|
||||||
|
mountComponent();
|
||||||
|
cy.get('.q-field__native').click();
|
||||||
|
cy.get('.q-dialog').should('be.visible');
|
||||||
|
cy.get('.q-dialog').within(() => {
|
||||||
|
cy.get('form').should('exist');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -1,8 +1,82 @@
|
||||||
|
/// <reference types="cypress" />
|
||||||
import VnLog from 'src/components/common/VnLog.vue';
|
import VnLog from 'src/components/common/VnLog.vue';
|
||||||
|
|
||||||
describe.skip('<VnLog />', () => {
|
describe('<VnLog />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
const mountComponent = (opt) => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
cy.createWrapper(VnLog, opt);
|
||||||
cy.createWrapper(VnLog);
|
};
|
||||||
|
|
||||||
|
it('renders with default props', () => {
|
||||||
|
mountComponent({});
|
||||||
|
cy.get('.q-field__label').should('contain', 'Location');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders with model and url props', () => {
|
||||||
|
const model = 'testModel';
|
||||||
|
const url = 'http://example.com/api/logs';
|
||||||
|
mountComponent({ model, url });
|
||||||
|
cy.get('.q-field__label').should('contain', 'Location');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('fetches data and displays logs', () => {
|
||||||
|
const model = 'testModel';
|
||||||
|
const url = 'http://example.com/api/logs';
|
||||||
|
mountComponent({ model, url });
|
||||||
|
cy.intercept('GET', `${url}/*`, { fixture: 'logs.json' }).as('getLogs');
|
||||||
|
cy.wait('@getLogs');
|
||||||
|
cy.get('.logs').should('exist');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('applies filters correctly', () => {
|
||||||
|
const model = 'testModel';
|
||||||
|
const url = 'http://example.com/api/logs';
|
||||||
|
mountComponent({ model, url });
|
||||||
|
cy.get('input[aria-label="Search"]').type('test search{enter}');
|
||||||
|
cy.get('.logs').should('exist');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('clears filters correctly', () => {
|
||||||
|
const model = 'testModel';
|
||||||
|
const url = 'http://example.com/api/logs';
|
||||||
|
mountComponent({ model, url });
|
||||||
|
cy.get('input[aria-label="Search"]').type('test search{enter}');
|
||||||
|
cy.get('.q-btn[icon="filter_alt_off"]').click();
|
||||||
|
cy.get('input[aria-label="Search"]').should('have.value', '');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders date filters correctly', () => {
|
||||||
|
const model = 'testModel';
|
||||||
|
const url = 'http://example.com/api/logs';
|
||||||
|
mountComponent({ model, url });
|
||||||
|
cy.get('input[aria-label="Date from"]').click();
|
||||||
|
cy.get('.q-date').should('be.visible');
|
||||||
|
cy.get('input[aria-label="Date to"]').click();
|
||||||
|
cy.get('.q-date').should('be.visible');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders user filters correctly', () => {
|
||||||
|
const model = 'testModel';
|
||||||
|
const url = 'http://example.com/api/logs';
|
||||||
|
mountComponent({ model, url });
|
||||||
|
cy.get('input[aria-label="User"]').click();
|
||||||
|
cy.get('.q-menu').should('be.visible');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders action filters correctly', () => {
|
||||||
|
const model = 'testModel';
|
||||||
|
const url = 'http://example.com/api/logs';
|
||||||
|
mountComponent({ model, url });
|
||||||
|
cy.get('input[aria-label="Action"]').click();
|
||||||
|
cy.get('.q-menu').should('be.visible');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders log details correctly', () => {
|
||||||
|
const model = 'testModel';
|
||||||
|
const url = 'http://example.com/api/logs';
|
||||||
|
mountComponent({ model, url });
|
||||||
|
cy.intercept('GET', `${url}/*`, { fixture: 'logs.json' }).as('getLogs');
|
||||||
|
cy.wait('@getLogs');
|
||||||
|
cy.get('.logs .model-log').first().click();
|
||||||
|
cy.get('.change-detail').should('be.visible');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnLogFilter from 'src/components/common/VnLogFilter.vue';
|
import VnLogFilter from 'src/components/common/VnLogFilter.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnLogFilter />', () => {
|
describe.skip('<VnLogFilter />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnPopup from 'src/components/common/VnPopup.vue';
|
import VnPopup from 'src/components/common/VnPopup.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnPopup />', () => {
|
describe.skip('<VnPopup />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnProgressModal from 'src/components/common/VnProgressModal.vue';
|
import VnProgressModal from 'src/components/common/VnProgressModal.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnProgressModal />', () => {
|
describe.skip('<VnProgressModal />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnRadio from 'src/components/common/VnRadio.vue';
|
import VnRadio from 'src/components/common/VnRadio.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnRadio />', () => {
|
describe.skip('<VnRadio />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnSectionMain from 'src/components/common/VnSectionMain.vue';
|
import VnSectionMain from 'src/components/common/VnSectionMain.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnSectionMain />', () => {
|
describe.skip('<VnSectionMain />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnSelect from 'src/components/common/VnSelect.vue';
|
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnSelect />', () => {
|
describe.skip('<VnSelect />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnSelectCache from 'src/components/common/VnSelectCache.vue';
|
import VnSelectCache from 'src/components/common/VnSelectCache.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnSelectCache />', () => {
|
describe.skip('<VnSelectCache />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnSelectDialog from 'src/components/common/VnSelectDialog.vue';
|
import VnSelectDialog from 'src/components/common/VnSelectDialog.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnSelectDialog />', () => {
|
describe.skip('<VnSelectDialog />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnSelectEnum from 'src/components/common/VnSelectEnum.vue';
|
import VnSelectEnum from 'src/components/common/VnSelectEnum.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnSelectEnum />', () => {
|
describe.skip('<VnSelectEnum />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnSmsDialog from 'src/components/common/VnSmsDialog.vue';
|
import VnSmsDialog from 'src/components/common/VnSmsDialog.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnSmsDialog />', () => {
|
describe.skip('<VnSmsDialog />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnSummaryDialog from 'src/components/common/VnSummaryDialog.vue';
|
import VnSummaryDialog from 'src/components/common/VnSummaryDialog.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnSummaryDialog />', () => {
|
describe.skip('<VnSummaryDialog />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,8 +1,12 @@
|
||||||
|
/// <reference types="cypress" />
|
||||||
import VnTitle from 'src/components/common/VnTitle.vue';
|
import VnTitle from 'src/components/common/VnTitle.vue';
|
||||||
|
|
||||||
describe('<VnTitle />', () => {
|
describe('<VnTitle />', () => {
|
||||||
|
const mountComponent = (opt) => {
|
||||||
|
cy.createWrapper(VnTitle, opt);
|
||||||
|
};
|
||||||
it('renders text with link', () => {
|
it('renders text with link', () => {
|
||||||
cy.createWrapper(VnTitle, {
|
mountComponent({
|
||||||
props: {
|
props: {
|
||||||
url: 'https://example.com',
|
url: 'https://example.com',
|
||||||
text: 'Example Link',
|
text: 'Example Link',
|
||||||
|
@ -13,7 +17,7 @@ describe('<VnTitle />', () => {
|
||||||
cy.get('a').should('contain.text', 'Example Link');
|
cy.get('a').should('contain.text', 'Example Link');
|
||||||
});
|
});
|
||||||
it('renders text without link', () => {
|
it('renders text without link', () => {
|
||||||
cy.createWrapper(VnTitle, {
|
mountComponent({
|
||||||
props: {
|
props: {
|
||||||
text: 'No Link',
|
text: 'No Link',
|
||||||
},
|
},
|
||||||
|
@ -24,21 +28,21 @@ describe('<VnTitle />', () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
it('applies correct classes based on url prop', () => {
|
it('applies correct classes based on url prop', () => {
|
||||||
cy.createWrapper(VnTitle, {
|
mountComponent({
|
||||||
props: {
|
props: {
|
||||||
url: 'https://example.com',
|
url: 'https://example.com',
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
cy.get('a').should('have.class', 'link');
|
cy.get('a').should('have.class', 'link');
|
||||||
|
|
||||||
cy.createWrapper(VnTitle, {
|
mountComponent({
|
||||||
props: {},
|
props: {},
|
||||||
});
|
});
|
||||||
cy.get('a').should('have.class', 'color-vn-text');
|
cy.get('a').should('have.class', 'color-vn-text');
|
||||||
});
|
});
|
||||||
|
|
||||||
it('displays icon when url is provided', () => {
|
it('displays icon when url is provided', () => {
|
||||||
cy.createWrapper(VnTitle, {
|
mountComponent({
|
||||||
props: {
|
props: {
|
||||||
url: 'https://example.com',
|
url: 'https://example.com',
|
||||||
},
|
},
|
||||||
|
@ -47,27 +51,27 @@ describe('<VnTitle />', () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
it('does not display icon when url is not provided', () => {
|
it('does not display icon when url is not provided', () => {
|
||||||
cy.createWrapper(VnTitle, {
|
mountComponent({
|
||||||
props: {},
|
props: {},
|
||||||
});
|
});
|
||||||
cy.get('.q-icon').should('not.exist');
|
cy.get('.q-icon').should('not.exist');
|
||||||
});
|
});
|
||||||
|
|
||||||
it('applies correct cursor style based on url prop', () => {
|
it('applies correct cursor style based on url prop', () => {
|
||||||
cy.createWrapper(VnTitle, {
|
mountComponent({
|
||||||
props: {
|
props: {
|
||||||
url: 'https://example.com',
|
url: 'https://example.com',
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
cy.get('.header-link').should('have.css', 'cursor', 'pointer');
|
cy.get('.header-link').should('have.css', 'cursor', 'pointer');
|
||||||
|
|
||||||
cy.createWrapper(VnTitle, {
|
mountComponent({
|
||||||
props: {},
|
props: {},
|
||||||
});
|
});
|
||||||
cy.get('.header-link').should('have.css', 'cursor', 'default');
|
cy.get('.header-link').should('have.css', 'cursor', 'default');
|
||||||
});
|
});
|
||||||
it('renders default icon when no icon prop is provided', () => {
|
it('renders default icon when no icon prop is provided', () => {
|
||||||
cy.createWrapper(VnTitle, {
|
mountComponent({
|
||||||
props: {
|
props: {
|
||||||
url: 'https://example.com',
|
url: 'https://example.com',
|
||||||
},
|
},
|
||||||
|
@ -76,7 +80,7 @@ describe('<VnTitle />', () => {
|
||||||
});
|
});
|
||||||
|
|
||||||
it('renders custom icon when icon prop is provided', () => {
|
it('renders custom icon when icon prop is provided', () => {
|
||||||
cy.createWrapper(VnTitle, {
|
mountComponent({
|
||||||
props: {
|
props: {
|
||||||
url: 'https://example.com',
|
url: 'https://example.com',
|
||||||
icon: 'custom_icon',
|
icon: 'custom_icon',
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnWeekdayPicker from 'src/components/common/VnWeekdayPicker.vue';
|
import VnWeekdayPicker from 'src/components/common/VnWeekdayPicker.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnWeekdayPicker />', () => {
|
describe.skip('<VnWeekdayPicker />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import vnDiscount from 'src/components/common/vnDiscount.vue';
|
import vnDiscount from 'src/components/common/vnDiscount.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<vnDiscount />', () => {
|
describe.skip('<vnDiscount />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import CardDescriptor from 'src/components/ui/CardDescriptor.vue';
|
import CardDescriptor from 'src/components/ui/CardDescriptor.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<CardDescriptor />', () => {
|
describe.skip('<CardDescriptor />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import CardList from 'src/components/ui/CardList.vue';
|
import CardList from 'src/components/ui/CardList.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<CardList />', () => {
|
describe.skip('<CardList />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import CardSummary from 'src/components/ui/CardSummary.vue';
|
import CardSummary from 'src/components/ui/CardSummary.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<CardSummary />', () => {
|
describe.skip('<CardSummary />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import CatalogItem from 'src/components/ui/CatalogItem.vue';
|
import CatalogItem from 'src/components/ui/CatalogItem.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<CatalogItem />', () => {
|
describe.skip('<CatalogItem />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,8 +1,64 @@
|
||||||
import FetchedTags from 'src/components/ui/FetchedTags.vue';
|
/// <reference types="cypress" />
|
||||||
|
import FetchedTags from 'src/components/ui/FetchedTags.vue'; // Ajusta la ruta según tu estructura de proyecto
|
||||||
|
|
||||||
describe.skip('<FetchedTags />', () => {
|
describe('FetchedTags', () => {
|
||||||
it('TODO: boilerplate', () => {
|
const mountComponent = (opt = {}) => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
cy.createWrapper(FetchedTags, {
|
||||||
cy.createWrapper(FetchedTags);
|
props: { ...opt },
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
it('renders with default props', () => {
|
||||||
|
const item = {
|
||||||
|
tag1: 'Tag 1',
|
||||||
|
value1: 'Value 1',
|
||||||
|
tag2: 'Tag 2',
|
||||||
|
value2: 'Value 2',
|
||||||
|
};
|
||||||
|
mountComponent({ item });
|
||||||
|
cy.get('.fetchedTags').should('exist');
|
||||||
|
cy.get('.inline-tag').should('have.length', 2);
|
||||||
|
cy.get('.inline-tag').first().should('contain', 'Value 1');
|
||||||
|
cy.get('.inline-tag').last().should('contain', 'Value 2');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders with custom tag and value props', () => {
|
||||||
|
const item = {
|
||||||
|
customTag1: 'Custom Tag 1',
|
||||||
|
customValue1: 'Custom Value 1',
|
||||||
|
customTag2: 'Custom Tag 2',
|
||||||
|
customValue2: 'Custom Value 2',
|
||||||
|
};
|
||||||
|
mountComponent({ item, tag: 'customTag', value: 'customValue' });
|
||||||
|
cy.get('.fetchedTags').should('exist');
|
||||||
|
cy.get('.inline-tag').should('have.length', 2);
|
||||||
|
cy.get('.inline-tag').first().should('contain', 'Custom Value 1');
|
||||||
|
cy.get('.inline-tag').last().should('contain', 'Custom Value 2');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders empty tags correctly', () => {
|
||||||
|
const item = {
|
||||||
|
tag1: 'Tag 1',
|
||||||
|
value1: '',
|
||||||
|
tag2: 'Tag 2',
|
||||||
|
value2: '',
|
||||||
|
};
|
||||||
|
mountComponent({ item });
|
||||||
|
cy.get('.fetchedTags').should('exist');
|
||||||
|
cy.get('.inline-tag').should('have.length', 2);
|
||||||
|
cy.get('.inline-tag').first().should('have.class', 'empty');
|
||||||
|
cy.get('.inline-tag').last().should('have.class', 'empty');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders tags with missing values correctly', () => {
|
||||||
|
const item = {
|
||||||
|
tag1: 'Tag 1',
|
||||||
|
tag2: 'Tag 2',
|
||||||
|
};
|
||||||
|
mountComponent({ item });
|
||||||
|
cy.get('.fetchedTags').should('exist');
|
||||||
|
cy.get('.inline-tag').should('have.length', 2);
|
||||||
|
cy.get('.inline-tag').first().should('have.class', 'empty');
|
||||||
|
cy.get('.inline-tag').last().should('have.class', 'empty');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import QCalendarMonthWrapper from 'src/components/ui/QCalendarMonthWrapper.vue';
|
import QCalendarMonthWrapper from 'src/components/ui/QCalendarMonthWrapper.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<QCalendarMonthWrapper />', () => {
|
describe.skip('<QCalendarMonthWrapper />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import SkeletonDescriptor from 'src/components/ui/SkeletonDescriptor.vue';
|
import SkeletonDescriptor from 'src/components/ui/SkeletonDescriptor.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<SkeletonDescriptor />', () => {
|
describe.skip('<SkeletonDescriptor />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import SkeletonForm from 'src/components/ui/SkeletonForm.vue';
|
import SkeletonForm from 'src/components/ui/SkeletonForm.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<SkeletonForm />', () => {
|
describe.skip('<SkeletonForm />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import SkeletonSummary from 'src/components/ui/SkeletonSummary.vue';
|
import SkeletonSummary from 'src/components/ui/SkeletonSummary.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<SkeletonSummary />', () => {
|
describe.skip('<SkeletonSummary />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import SkeletonTable from 'src/components/ui/SkeletonTable.vue';
|
import SkeletonTable from 'src/components/ui/SkeletonTable.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<SkeletonTable />', () => {
|
describe.skip('<SkeletonTable />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,8 +1,64 @@
|
||||||
import VnAvatar from 'src/components/ui/VnAvatar.vue';
|
/// <reference types="cypress" />
|
||||||
|
import VnAvatar from 'src/components/ui/VnAvatar.vue'; // Ajusta la ruta según tu estructura de proyecto
|
||||||
|
|
||||||
describe.skip('<VnAvatar />', () => {
|
describe('VnAvatar', () => {
|
||||||
it('TODO: boilerplate', () => {
|
const mountComponent = (opt = {}) => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
cy.createWrapper(VnAvatar, {
|
||||||
cy.createWrapper(VnAvatar);
|
props: {
|
||||||
|
...opt,
|
||||||
|
},
|
||||||
|
global: {
|
||||||
|
mocks: {
|
||||||
|
useSession: () => ({
|
||||||
|
getTokenMultimedia: () => 'test-token',
|
||||||
|
}),
|
||||||
|
useColor: () => '#535353',
|
||||||
|
getCssVar: () => '#FFFFFF',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
it('renders with default props', () => {
|
||||||
|
mountComponent();
|
||||||
|
cy.get('.q-avatar').should('exist');
|
||||||
|
cy.get('.q-img').should('exist');
|
||||||
|
cy.get('.q-avatar').should('have.attr', 'title', 'System');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('displays uppercase title if provided', () => {
|
||||||
|
mountComponent({ title: 'Test Title' });
|
||||||
|
cy.get('.q-avatar').should('have.attr', 'title', 'TEST TITLE');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('uses default title when title prop is not provided', () => {
|
||||||
|
mountComponent();
|
||||||
|
cy.get('.q-avatar').should('have.attr', 'title', 'System');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('shows first letter of title when image fails to load', () => {
|
||||||
|
mountComponent({ title: 'Test' });
|
||||||
|
cy.get('.q-img').should('exist');
|
||||||
|
cy.get('.q-img').invoke('trigger', 'error');
|
||||||
|
cy.get('.q-avatar').contains('T');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('applies background color from color prop', () => {
|
||||||
|
mountComponent({ color: 'red' });
|
||||||
|
cy.get('.q-avatar')
|
||||||
|
.should('have.attr', 'style')
|
||||||
|
.and('include', 'background-color: red;');
|
||||||
|
});
|
||||||
|
|
||||||
|
it.only('applies background color from useColor when color prop is not provided', () => {
|
||||||
|
mountComponent({ title: 'Test' });
|
||||||
|
cy.get('.q-avatar')
|
||||||
|
.should('have.attr', 'style')
|
||||||
|
.and('include', 'background-color: #000000;');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('displays description slot if provided', () => {
|
||||||
|
mountComponent({ description: 'Test Description' });
|
||||||
|
cy.get('.description').should('exist').and('contain', 'Test Description');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnConfirm from 'src/components/ui/VnConfirm.vue';
|
import VnConfirm from 'src/components/ui/VnConfirm.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnConfirm />', () => {
|
describe.skip('<VnConfirm />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
|
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnFilterPanel />', () => {
|
describe.skip('<VnFilterPanel />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnFilterPanelChip from 'src/components/ui/VnFilterPanelChip.vue';
|
import VnFilterPanelChip from 'src/components/ui/VnFilterPanelChip.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnFilterPanelChip />', () => {
|
describe.skip('<VnFilterPanelChip />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnImg from 'src/components/ui/VnImg.vue';
|
import VnImg from 'src/components/ui/VnImg.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnImg />', () => {
|
describe.skip('<VnImg />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
|
import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnLinkPhone />', () => {
|
describe.skip('<VnLinkPhone />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,8 +1,32 @@
|
||||||
|
import { Dark } from 'quasar';
|
||||||
import VnLogo from 'src/components/ui/VnLogo.vue';
|
import VnLogo from 'src/components/ui/VnLogo.vue';
|
||||||
|
|
||||||
describe.skip('<VnLogo />', () => {
|
/// <reference types="cypress" />
|
||||||
it('TODO: boilerplate', () => {
|
describe('<VnLogo />', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
const mountComponent = (opt = {}) => {
|
||||||
cy.createWrapper(VnLogo);
|
cy.createWrapper(VnLogo, { props: { ...opt } });
|
||||||
|
};
|
||||||
|
it('renders with default logo', () => {
|
||||||
|
mountComponent();
|
||||||
|
cy.get('img').should('have.attr', 'src').and('include', 'salix.svg');
|
||||||
|
});
|
||||||
|
|
||||||
|
it.skip('renders with dark mode logo', () => {
|
||||||
|
cy.stub(Dark, 'isActive').returns(true);
|
||||||
|
mountComponent();
|
||||||
|
// Dark.set(true);
|
||||||
|
cy.get('img').should('have.attr', 'src').and('include', 'salix_dark.svg');
|
||||||
|
Dark.set(false); // Reset dark mode
|
||||||
|
});
|
||||||
|
|
||||||
|
it.skip('renders with custom logo', () => {
|
||||||
|
mountComponent({ logo: 'custom' });
|
||||||
|
cy.get('img').should('have.attr', 'src').and('include', 'custom.svg');
|
||||||
|
});
|
||||||
|
|
||||||
|
it.skip('renders with custom dark mode logo', () => {
|
||||||
|
mountComponent({ logo: 'custom' });
|
||||||
|
cy.get('img').should('have.attr', 'src').and('include', 'custom_dark.svg');
|
||||||
|
Dark.set(false); // Reset dark mode
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -1,8 +1,72 @@
|
||||||
import VnLv from 'src/components/ui/VnLv.vue';
|
import VnLv from 'src/components/ui/VnLv.vue';
|
||||||
|
import { useClipboard } from 'src/composables/useClipboard';
|
||||||
|
|
||||||
describe.skip('<VnLv />', () => {
|
/// <reference types="cypress" />
|
||||||
it('TODO: boilerplate', () => {
|
describe('<VnLv />', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
before('login', () => {
|
||||||
cy.createWrapper(VnLv);
|
Cypress.on('uncaught:exception', () => false);
|
||||||
|
});
|
||||||
|
const mountComponent = (opt = {}) => cy.createWrapper(VnLv, { props: { ...opt } });
|
||||||
|
|
||||||
|
it('renders with default props', () => {
|
||||||
|
mountComponent();
|
||||||
|
cy.get('.vn-label-value').should('exist');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders label and value correctly', () => {
|
||||||
|
mountComponent({ label: 'Test Label', value: 'Test Value' });
|
||||||
|
cy.get('.label span').should('contain', 'Test Label');
|
||||||
|
cy.get('.value span').should('contain', 'Test Value');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders boolean value as checkbox', () => {
|
||||||
|
mountComponent({ label: 'Test Label', value: true });
|
||||||
|
cy.get('.q-checkbox').should('exist');
|
||||||
|
cy.get('.q-checkbox').should('have.class', 'disabled');
|
||||||
|
});
|
||||||
|
|
||||||
|
it.only('renders info icon with tooltip', () => {
|
||||||
|
mountComponent({ info: 'Test Info' });
|
||||||
|
cy.get('.info .q-icon').should('exist');
|
||||||
|
cy.get('.info .q-icon').then((el) => {
|
||||||
|
el.trigger('mouseover');
|
||||||
|
});
|
||||||
|
// TODO
|
||||||
|
// cy.get('.q-tooltip').should('contain', 'Test Info');
|
||||||
|
});
|
||||||
|
|
||||||
|
it.only('renders copy icon and copies value', () => {
|
||||||
|
mountComponent({ value: 'Test Value', copy: true });
|
||||||
|
// cy.spy(el, 'copyText').as('copyValueText');
|
||||||
|
cy.get('.copy .q-icon').should('exist');
|
||||||
|
cy.get('.copy .q-icon').then((el) => {
|
||||||
|
el.trigger('click');
|
||||||
|
});
|
||||||
|
cy.get('.q-notification__message').should('exist');
|
||||||
|
// cy.window().focused();
|
||||||
|
// cy.window().then((win) => {
|
||||||
|
// win.navigator.clipboard.readText().then((text) => {
|
||||||
|
// console.log('Helloooo:' + text);
|
||||||
|
// });
|
||||||
|
// });
|
||||||
|
// cy.window()
|
||||||
|
// .its('navigator.clipboard')
|
||||||
|
// .invoke('readText')
|
||||||
|
// .should('equal', 'Test Value');
|
||||||
|
// cy.window().then((win) => {
|
||||||
|
// win.focus();
|
||||||
|
// cy.wrap(win.navigator.clipboard.readText()).should('equal', 'Test Value');
|
||||||
|
// });
|
||||||
|
// expect('@copyValueText').to.be.called;
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders dash if value is empty and dash is true', () => {
|
||||||
|
mountComponent({ value: '', dash: true });
|
||||||
|
cy.get('.value span').should('contain', '-');
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders value as is if dash is false', () => {
|
||||||
|
mountComponent({ value: '', dash: false });
|
||||||
|
cy.get('.value span').should('contain', '');
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnNotes from 'src/components/ui/VnNotes.vue';
|
import VnNotes from 'src/components/ui/VnNotes.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnNotes />', () => {
|
describe.skip('<VnNotes />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnOutForm from 'src/components/ui/VnOutForm.vue';
|
import VnOutForm from 'src/components/ui/VnOutForm.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnOutForm />', () => {
|
describe.skip('<VnOutForm />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnPaginate from 'src/components/ui/VnPaginate.vue';
|
import VnPaginate from 'src/components/ui/VnPaginate.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnPaginate />', () => {
|
describe.skip('<VnPaginate />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnRow from 'src/components/ui/VnRow.vue';
|
import VnRow from 'src/components/ui/VnRow.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnRow />', () => {
|
describe.skip('<VnRow />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnSearchbar />', () => {
|
describe.skip('<VnSearchbar />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnSms from 'src/components/ui/VnSms.vue';
|
import VnSms from 'src/components/ui/VnSms.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnSms />', () => {
|
describe.skip('<VnSms />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnSubToolbar />', () => {
|
describe.skip('<VnSubToolbar />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import VnUserLink from 'src/components/ui/VnUserLink.vue';
|
import VnUserLink from 'src/components/ui/VnUserLink.vue';
|
||||||
|
|
||||||
|
/// <reference types="cypress" />
|
||||||
describe.skip('<VnUserLink />', () => {
|
describe.skip('<VnUserLink />', () => {
|
||||||
it('TODO: boilerplate', () => {
|
it('TODO: boilerplate', () => {
|
||||||
// see: https://on.cypress.io/mounting-vue
|
// see: https://on.cypress.io/mounting-vue
|
||||||
|
|
|
@ -8,9 +8,9 @@ import 'quasar/dist/quasar.css';
|
||||||
import { createRouter, createMemoryHistory } from 'vue-router';
|
import { createRouter, createMemoryHistory } from 'vue-router';
|
||||||
import { useArrayDataStore } from 'src/stores/useArrayDataStore';
|
import { useArrayDataStore } from 'src/stores/useArrayDataStore';
|
||||||
import { createWebHistory } from 'vue-router';
|
import { createWebHistory } from 'vue-router';
|
||||||
import { Quasar, Dialog, Notify } from 'quasar';
|
import { Quasar, Dialog, Notify, Dark } from 'quasar';
|
||||||
|
|
||||||
installQuasarPlugin({ plugins: { Dialog, Notify } });
|
installQuasarPlugin({ plugins: { Dialog, Notify, Dark } });
|
||||||
setActivePinia(createPinia());
|
setActivePinia(createPinia());
|
||||||
axios.defaults.baseURL = Cypress.env('baseUrl');
|
axios.defaults.baseURL = Cypress.env('baseUrl');
|
||||||
|
|
||||||
|
@ -100,13 +100,15 @@ function createWrapper(component, options = {}) {
|
||||||
app.use(options.router);
|
app.use(options.router);
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const wrapper = mount(component, mountOptions);
|
const wrapper = mount(component, mountOptions);
|
||||||
const vm = wrapper.vm;
|
|
||||||
|
|
||||||
return wrapper;
|
return wrapper;
|
||||||
}
|
}
|
||||||
|
Cypress.on('uncaught:exception', (err, runnable) => {
|
||||||
|
// returning false here prevents Cypress from
|
||||||
|
// failing the test
|
||||||
|
return false;
|
||||||
|
});
|
||||||
Cypress.Commands.add('createWrapper', createWrapper);
|
Cypress.Commands.add('createWrapper', createWrapper);
|
||||||
|
|
||||||
Cypress.Commands.add('_vnMount', (component, options = {}) => {
|
Cypress.Commands.add('_vnMount', (component, options = {}) => {
|
||||||
|
|
|
@ -15,3 +15,8 @@
|
||||||
|
|
||||||
import './commands';
|
import './commands';
|
||||||
|
|
||||||
|
Cypress.on('uncaught:exception', (err, runnable) => {
|
||||||
|
// returning false here prevents Cypress from
|
||||||
|
// failing the test
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
|
|
@ -27,7 +27,7 @@ import '@quasar/extras/material-icons/material-icons.css';
|
||||||
|
|
||||||
import { installQuasarPlugin } from '@quasar/quasar-app-extension-testing-e2e-cypress';
|
import { installQuasarPlugin } from '@quasar/quasar-app-extension-testing-e2e-cypress';
|
||||||
import { config } from '@vue/test-utils';
|
import { config } from '@vue/test-utils';
|
||||||
import { Dialog } from 'quasar';
|
import { Dialog, Notify, Dark } from 'quasar';
|
||||||
|
|
||||||
// Example to import i18n from boot and use as plugin
|
// Example to import i18n from boot and use as plugin
|
||||||
// import { i18n } from 'src/boot/i18n';
|
// import { i18n } from 'src/boot/i18n';
|
||||||
|
@ -43,4 +43,4 @@ config.global.mocks = {
|
||||||
// We do want transitions to show when doing visual testing :)
|
// We do want transitions to show when doing visual testing :)
|
||||||
config.global.stubs = {};
|
config.global.stubs = {};
|
||||||
|
|
||||||
installQuasarPlugin({ plugins: { Dialog } });
|
installQuasarPlugin({ plugins: { Dialog, Notify, Dark } });
|
||||||
|
|
|
@ -0,0 +1,132 @@
|
||||||
|
import { vi, describe, it, expect, beforeEach } from 'vitest';
|
||||||
|
import { createWrapper, axios } from 'app/test/vitest/helper';
|
||||||
|
|
||||||
|
import VnLocation from 'src/components/common/VnLocation.vue'; // Ajusta la ruta según tu estructura de proyecto
|
||||||
|
|
||||||
|
describe('VnLocation', () => {
|
||||||
|
let wrapper, vm;
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
vi.spyOn(axios, 'get').mockResolvedValue({
|
||||||
|
data: [
|
||||||
|
{
|
||||||
|
townFk: 1,
|
||||||
|
provinceFk: 1,
|
||||||
|
countryFk: 1,
|
||||||
|
code: '46000',
|
||||||
|
town: 'Valencia',
|
||||||
|
province: 'Province one',
|
||||||
|
country: 'España',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
townFk: 1,
|
||||||
|
provinceFk: 1,
|
||||||
|
countryFk: 1,
|
||||||
|
code: '46600',
|
||||||
|
town: 'Valencia',
|
||||||
|
province: 'Province one',
|
||||||
|
country: 'España',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
townFk: 2,
|
||||||
|
provinceFk: 1,
|
||||||
|
countryFk: 1,
|
||||||
|
code: '46460',
|
||||||
|
town: 'Gotham',
|
||||||
|
province: 'Province one',
|
||||||
|
country: 'España',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
townFk: 3,
|
||||||
|
provinceFk: 1,
|
||||||
|
countryFk: 1,
|
||||||
|
code: '46680',
|
||||||
|
town: 'Algemesi',
|
||||||
|
province: 'Province one',
|
||||||
|
country: 'España',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
townFk: 4,
|
||||||
|
provinceFk: 1,
|
||||||
|
countryFk: 1,
|
||||||
|
code: '46600',
|
||||||
|
town: 'Alzira',
|
||||||
|
province: 'Province one',
|
||||||
|
country: 'España',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
townFk: 5,
|
||||||
|
provinceFk: 5,
|
||||||
|
countryFk: 13,
|
||||||
|
code: 'EC170150',
|
||||||
|
town: 'Quito',
|
||||||
|
province: 'Province five',
|
||||||
|
country: 'Ecuador',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
});
|
||||||
|
const cmp = createWrapper(VnLocation, {
|
||||||
|
global: {
|
||||||
|
stubs: [
|
||||||
|
'vnPaginate',
|
||||||
|
'useState',
|
||||||
|
'arrayData',
|
||||||
|
'useStateStore',
|
||||||
|
'vue-i18n',
|
||||||
|
],
|
||||||
|
},
|
||||||
|
});
|
||||||
|
wrapper = cmp.wrapper;
|
||||||
|
vm = cmp.vm;
|
||||||
|
});
|
||||||
|
|
||||||
|
it.only('should handle click on input', async () => {
|
||||||
|
// Simula el clic en el input de ubicación
|
||||||
|
await wrapper.get('input[aria-label="Location"]').trigger('click');
|
||||||
|
const labelFormatted = vm.showLabel({
|
||||||
|
townFk: 5,
|
||||||
|
provinceFk: 5,
|
||||||
|
countryFk: 13,
|
||||||
|
code: 'EC170150',
|
||||||
|
town: 'Quito',
|
||||||
|
province: 'Province five',
|
||||||
|
country: 'Ecuador',
|
||||||
|
});
|
||||||
|
expect(labelFormatted).toBe('EC170150, Quito(Province five), Ecuador');
|
||||||
|
// Verifica que los datos se hayan cargado correctamente
|
||||||
|
await wrapper.vm.$nextTick(); // Espera a que se actualice el DOM
|
||||||
|
const options = wrapper.findAll('select[name="town"] option');
|
||||||
|
expect(options).toHaveLength(6); // Verifica que las opciones se hayan cargado
|
||||||
|
});
|
||||||
|
it('should filter provinces based on selected country', async () => {
|
||||||
|
// Simula la selección de un país
|
||||||
|
const element = await wrapper.get('input[aria-label="Location"]');
|
||||||
|
element.setValue('Ecuador');
|
||||||
|
await vm.$nextTick();
|
||||||
|
|
||||||
|
// Verifica que las provincias se filtren
|
||||||
|
const provinces = wrapper.findAll('select[name="province"] option');
|
||||||
|
expect(provinces).toHaveLength(1);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should filter towns based on selected province', async () => {
|
||||||
|
// Simula la selección de una provincia
|
||||||
|
await wrapper.find('select[name="province"]').setValue('Ecuador');
|
||||||
|
|
||||||
|
// Verifica que los pueblos se filtren
|
||||||
|
const towns = wrapper.findAll('select[name="town"] option');
|
||||||
|
expect(towns).toHaveLength(1);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should pass selected country', async () => {
|
||||||
|
const country = 'Ecuador';
|
||||||
|
const province = 'Province five';
|
||||||
|
|
||||||
|
// Simula la selección de un país y una provincia
|
||||||
|
await wrapper.find('select[name="country"]').setValue(country);
|
||||||
|
await wrapper.find('select[name="province"]').setValue(province);
|
||||||
|
|
||||||
|
// Verifica que el valor seleccionado se pase correctamente
|
||||||
|
expect(wrapper.find('select[name="province"]').element.value).toBe(province);
|
||||||
|
});
|
||||||
|
});
|
|
@ -15,6 +15,7 @@ export default defineConfig({
|
||||||
// Matches all files with extension 'js', 'jsx', 'ts' and 'tsx'
|
// Matches all files with extension 'js', 'jsx', 'ts' and 'tsx'
|
||||||
'test/vitest/__tests__/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}',
|
'test/vitest/__tests__/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}',
|
||||||
],
|
],
|
||||||
|
reporters: ['html'],
|
||||||
},
|
},
|
||||||
plugins: [
|
plugins: [
|
||||||
vue({
|
vue({
|
||||||
|
|
Loading…
Reference in New Issue