Skip to content

Commit

Permalink
fix: element label in Vue array renderer
Browse files Browse the repository at this point in the history
Replace `isNaN` with `Number.isNaN` to ensure accurate checks.
`isNaN` returns true for most text values, leading to missing 
labels in the Vue array renderer.

closes #2157
  • Loading branch information
LukasBoll committed Oct 24, 2023
1 parent 90d5db2 commit c9e8cde
Show file tree
Hide file tree
Showing 2 changed files with 81 additions and 1 deletion.
6 changes: 5 additions & 1 deletion packages/vue-vanilla/src/util/composition.ts
Original file line number Diff line number Diff line change
Expand Up @@ -120,7 +120,11 @@ export const useVanillaArrayControl = <I extends { control: any }>(
input.control.value.data,
composePaths(`${index}`, childLabelProp)
);
if (labelValue === undefined || labelValue === null || isNaN(labelValue)) {
if (
labelValue === undefined ||
labelValue === null ||
Number.isNaN(labelValue)
) {
return '';
}
return `${labelValue}`;
Expand Down
76 changes: 76 additions & 0 deletions packages/vue-vanilla/tests/unit/array/ArrayListRenderer.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,42 @@ const uischema = {
},
};

const schemaWithNameAndRate = {
type: 'array',
title: 'My Array',
maxItems: 3,
minItems: 1,
items: {
type: 'object',
properties: {
name: {
type: 'string',
},
rate: {
type: 'number',
},
},
},
};

const schemaWithCountAndName = {
type: 'array',
title: 'My Array',
maxItems: 3,
minItems: 1,
items: {
type: 'object',
properties: {
count: {
type: 'number',
},
name: {
type: 'string',
},
},
},
};

describe('ArrayListRenderer.vue', () => {
it('renders a fieldset', () => {
const wrapper = mountJsonForms(['a'], schema, uischema);
Expand Down Expand Up @@ -88,4 +124,44 @@ describe('ArrayListRenderer.vue', () => {
expect(type).to.equal('button');
}
});

it('compute default label', async () => {
const wrapper = mountJsonForms(
[{ name: 'name1', rate: 5 }],
schemaWithNameAndRate,
uischema
);
const labels = wrapper.findAll('.array-list-item-label');
const labelText = labels[0].text();
expect(labelText).to.equal('name1');
});

it('compute default label with undefined', async () => {
const wrapper = mountJsonForms([{}], schemaWithNameAndRate, uischema);
const labels = wrapper.findAll('.array-list-item-label');
const labelText = labels[0].text();
expect(labelText).to.equal('');
});

it('compute default label with number', async () => {
const wrapper = mountJsonForms(
[{ count: 1, name: 'name1' }],
schemaWithCountAndName,
uischema
);
const labels = wrapper.findAll('.array-list-item-label');
const labelText = labels[0].text();
expect(labelText).to.equal('1');
});

it('compute default label with NaN', async () => {
const wrapper = mountJsonForms(
[{ count: Number(undefined), name: 'name1' }],
schemaWithCountAndName,
uischema
);
const labels = wrapper.findAll('.array-list-item-label');
const labelText = labels[0].text();
expect(labelText).to.equal('');
});
});

0 comments on commit c9e8cde

Please sign in to comment.