verdnatura/salix-front
verdnatura
/
salix-front
2
3
Fork 1
Code Issues Pull Requests 92 Releases Wiki Activity

test: refs #6994 add json-link front test
gitea/salix-front/pipeline/pr-dev This commit is unstable Details

This commit is contained in:
Alex Moreno 2025-03-10 08:47:46 +01:00
parent b37fe3a6f3
commit 9f498c83df
2 changed files with 31 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/common/VnJsonValue.vue
View File

@ -4,7 +4,7 @@ import { toDateString } from 'src/filters';
import { useDescriptorStore } from 'src/stores/useDescriptorStore';
const props = defineProps({
value: { type: [String, Number, Boolean, Object], default: undefined },
value: { type: Object, default: undefined },
name: { type: String, default: undefined },
});
@ -32,6 +32,7 @@ const updateValue = () => {
Math.round((propsValue.value + Number.EPSILON) * 1000) / 1000
).toString();
}
cssClass = isLink(cssClass);
break;
case 'boolean':
t = propsValue.value ? '✓' : '✗';
@ -40,8 +41,9 @@ const updateValue = () => {
case 'string':
t =
propsValue.value.length <= maxStrLen
? propsValue
? propsValue.value
: propsValue.value.substring(0, maxStrLen) + '...';
cssClass = isLink(cssClass);
break;
case 'object':
if (propsValue.value instanceof Date) {
@ -56,6 +58,11 @@ const updateValue = () => {
}
};
function isLink(cssClass) {
if (!descriptorStore.has(props.name)) return cssClass;
return 'link json-link';
}
watch(() => props.value, updateValue);
updateValue();
@ -63,10 +70,9 @@ updateValue();
<template>
<span
:title="type === 'string' && value.length > maxStrLen ? value : ''"
:title="type === 'string' && propsValue.length > maxStrLen ? propsValue : ''"
:class="{
[cssClass]: t !== '',
'link json-link': descriptorStore.has(name),
}"
>
{{ t }}

34
src/components/common/__tests__/VnJsonValue.spec.js
View File

@ -1,6 +1,6 @@
import { describe, it, expect } from 'vitest';
import VnJsonValue from 'src/components/common/VnJsonValue.vue';
import { createWrapper } from 'app/test/vitest/helper';
import VnJsonValue from 'src/components/common/VnJsonValue.vue';
const buildComponent = (props) => {
return createWrapper(VnJsonValue, {
@ -10,28 +10,28 @@ const buildComponent = (props) => {
describe('VnJsonValue', () => {
it('renders null value correctly', async () => {
const wrapper = buildComponent({ value: null });
const wrapper = buildComponent({ value: { val: null } });
const span = wrapper.find('span');
expect(span.text()).toBe('∅');
expect(span.classes()).toContain('json-null');
});
it('renders boolean true correctly', async () => {
const wrapper = buildComponent({ value: true });
const wrapper = buildComponent({ value: { val: true } });
const span = wrapper.find('span');
expect(span.text()).toBe('✓');
expect(span.classes()).toContain('json-true');
});
it('renders boolean false correctly', async () => {
const wrapper = buildComponent({ value: false });
const wrapper = buildComponent({ value: { val: false } });
const span = wrapper.find('span');
expect(span.text()).toBe('✗');
expect(span.classes()).toContain('json-false');
});
it('renders a short string correctly', async () => {
const wrapper = buildComponent({ value: 'Hello' });
const wrapper = buildComponent({ value: { val: 'Hello' } });
const span = wrapper.find('span');
expect(span.text()).toBe('Hello');
expect(span.classes()).toContain('json-string');
@ -39,7 +39,7 @@ describe('VnJsonValue', () => {
it('renders a long string correctly with ellipsis', async () => {
const longString = 'a'.repeat(600);
const wrapper = buildComponent({ value: longString });
const wrapper = buildComponent({ value: { val: longString } });
const span = wrapper.find('span');
expect(span.text()).toContain('...');
expect(span.text().length).toBeLessThanOrEqual(515);
@ -48,14 +48,14 @@ describe('VnJsonValue', () => {
});
it('renders a number correctly', async () => {
const wrapper = buildComponent({ value: 123.4567 });
const wrapper = buildComponent({ value: { val: 123.4567 } });
const span = wrapper.find('span');
expect(span.text()).toBe('123.457');
expect(span.classes()).toContain('json-number');
});
it('renders an integer correctly', async () => {
const wrapper = buildComponent({ value: 42 });
const wrapper = buildComponent({ value: { val: 42 } });
const span = wrapper.find('span');
expect(span.text()).toBe('42');
expect(span.classes()).toContain('json-number');
@ -63,7 +63,7 @@ describe('VnJsonValue', () => {
it('renders a date correctly', async () => {
const date = new Date('2023-01-01');
const wrapper = buildComponent({ value: date });
const wrapper = buildComponent({ value: { val: date } });
const span = wrapper.find('span');
expect(span.text()).toBe('2023-01-01');
expect(span.classes()).toContain('json-object');
@ -71,7 +71,7 @@ describe('VnJsonValue', () => {
it('renders an object correctly', async () => {
const obj = { key: 'value' };
const wrapper = buildComponent({ value: obj });
const wrapper = buildComponent({ value: { val: obj } });
const span = wrapper.find('span');
expect(span.text()).toBe(obj.toString());
expect(span.classes()).toContain('json-object');
@ -79,15 +79,23 @@ describe('VnJsonValue', () => {
it('renders an array correctly', async () => {
const arr = [1, 2, 3];
const wrapper = buildComponent({ value: arr });
const wrapper = buildComponent({ value: { val: arr } });
const span = wrapper.find('span');
expect(span.text()).toBe(arr.toString());
expect(span.classes()).toContain('json-object');
});
it('renders an link(descriptor) correctly', async () => {
const id = 1;
const wrapper = buildComponent({ value: { val: id }, name: 'claimFk' });
const span = wrapper.find('span');
expect(span.text()).toBe(id.toString());
expect(span.classes()).toContain('json-link');
});
it('updates value when prop changes', async () => {
const wrapper = buildComponent({ value: true });
await wrapper.setProps({ value: 123 });
const wrapper = buildComponent({ value: { val: true } });
await wrapper.setProps({ value: { val: 123 } });
const span = wrapper.find('span');
expect(span.text()).toBe('123');
expect(span.classes()).toContain('json-number');