Skip to content

Commit

Permalink
feat(highlighting): support array syntax for nested attributes (#418)
Browse files Browse the repository at this point in the history 
* support array syntax for nested attributes fix `parseAlgoliaHit*` tests

* Increase bundle size

Co-authored-by: François Chalifour <[email protected]>
  • Loading branch information
@shortcuts @francoischalifour
shortcuts and francoischalifour authored Jan 29, 2021
1 parent 1eecc65 commit 4ad4e41
Show file tree
Hide file tree
Showing 15 changed files with 1,200 additions and 121 deletions.
6 changes: 3 additions & 3 deletions bundlesize.config.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,11 @@
},
{
"path": "packages/autocomplete-js/dist/umd/index.production.js",
"maxSize": "13.5 kB"
"maxSize": "13.65 kB"
},
{
"path": "packages/autocomplete-preset-algolia/dist/umd/index.production.js",
"maxSize": "1.5 kB"
"maxSize": "1.75 kB"
},
{
"path": "packages/autocomplete-plugin-algolia-insights/dist/umd/index.production.js",
Expand All @@ -22,7 +22,7 @@
},
{
"path": "packages/autocomplete-plugin-query-suggestions/dist/umd/index.production.js",
"maxSize": "2.5 kB"
"maxSize": "2.8 kB"
}
]
}
2 changes: 1 addition & 1 deletion packages/autocomplete-js/src/highlight.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ import { AutocompleteRenderer } from './types';

type HighlightItemParams<TItem> = {
hit: TItem;
attribute: keyof TItem;
attribute: keyof TItem | string[];
tagName?: string;
createElement?: AutocompleteRenderer['createElement'];
};
Expand Down
2 changes: 1 addition & 1 deletion packages/autocomplete-preset-algolia/src/highlight/ParseAlgoliaHitParams.ts
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
export type ParseAlgoliaHitParams<TItem> = {
hit: TItem;
attribute: keyof TItem;
attribute: keyof TItem | string[];
};
272 changes: 254 additions & 18 deletions ...ages/autocomplete-preset-algolia/src/highlight/__tests__/parseAlgoliaHitHighlight.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,26 +25,146 @@ describe('parseAlgoliaHitHighlight', () => {
},
},
})
).toMatchInlineSnapshot(`
Array [
Object {
"isHighlighted": true,
"value": "He",
},
Object {
"isHighlighted": false,
"value": "llo t",
).toEqual([
{
isHighlighted: true,
value: 'He',
},
{
isHighlighted: false,
value: 'llo t',
},
{
isHighlighted: true,
value: 'he',
},
{
isHighlighted: false,
value: 're',
},
]);
});

test('returns the highlighted parts of the hit with an array attribute', () => {
expect(
parseAlgoliaHitHighlight({
attribute: ['title'],
hit: {
objectID: '1',
title: 'Hello there',
_highlightResult: {
title: {
value:
'__aa-highlight__He__/aa-highlight__llo t__aa-highlight__he__/aa-highlight__re',
matchLevel: 'partial',
matchedWords: [],
fullyHighlighted: false,
},
},
},
Object {
"isHighlighted": true,
"value": "he",
})
).toEqual([
{
isHighlighted: true,
value: 'He',
},
{
isHighlighted: false,
value: 'llo t',
},
{
isHighlighted: true,
value: 'he',
},
{
isHighlighted: false,
value: 're',
},
]);
});

test('returns the highlighted parts of the hit with a nested array attribute', () => {
expect(
parseAlgoliaHitHighlight({
attribute: ['hierarchy', 'lvl0'],
hit: {
objectID: '1',
hierarchy: {
lvl0: 'Hello there',
},
_highlightResult: {
hierarchy: {
lvl0: {
value:
'__aa-highlight__He__/aa-highlight__llo t__aa-highlight__he__/aa-highlight__re',
matchLevel: 'partial',
matchedWords: [],
fullyHighlighted: false,
},
},
},
},
Object {
"isHighlighted": false,
"value": "re",
})
).toEqual([
{
isHighlighted: true,
value: 'He',
},
{
isHighlighted: false,
value: 'llo t',
},
{
isHighlighted: true,
value: 'he',
},
{
isHighlighted: false,
value: 're',
},
]);
});

test('returns the highlighted parts of the hit with a nested array attribute containing a dot', () => {
expect(
parseAlgoliaHitHighlight({
attribute: ['hierarchy', 'lvl0.inside'],
hit: {
objectID: '1',
hierarchy: {
'lvl0.inside': 'Hello there',
},
_highlightResult: {
hierarchy: {
'lvl0.inside': {
value:
'__aa-highlight__He__/aa-highlight__llo t__aa-highlight__he__/aa-highlight__re',
matchLevel: 'partial',
matchedWords: [],
fullyHighlighted: false,
},
},
},
},
]
`);
})
).toEqual([
{
isHighlighted: true,
value: 'He',
},
{
isHighlighted: false,
value: 'llo t',
},
{
isHighlighted: true,
value: 'he',
},
{
isHighlighted: false,
value: 're',
},
]);
});

test('returns the attribute value if the attribute cannot be highlighted', () => {
Expand Down Expand Up @@ -113,7 +233,123 @@ describe('parseAlgoliaHitHighlight', () => {
},
});
}).toWarnDev(
'[Autocomplete] The attribute "_highlightResult.description.value" does not exist on the hit. Did you set it in `attributesToHighlight`?' +
'[Autocomplete] The attribute "description" described by the path ["description"] does not exist on the hit. Did you set it in `attributesToHighlight`?' +
'\nSee https://www.algolia.com/doc/api-reference/api-parameters/attributesToHighlight/'
);
});

test('returns empty parts if the array attribute does not exist', () => {
expect(
parseAlgoliaHitHighlight({
attribute: ['description'],
hit: {
objectID: '1',
title: 'Hello there',
_snippetResult: {
title: {
value:
'__aa-highlight__He__/aa-highlight__llo t__aa-highlight__he__/aa-highlight__re',
},
},
},
})
).toEqual([]);
});

test('warns if the array attribute cannot be highlighted', () => {
expect(() => {
parseAlgoliaHitHighlight({
attribute: ['description'],
hit: {
objectID: '1',
title: 'Hello there',
description: 'Welcome all',
_highlightResult: {
title: {
value:
'__aa-highlight__He__/aa-highlight__llo t__aa-highlight__he__/aa-highlight__re',
matchLevel: 'partial',
matchedWords: [],
fullyHighlighted: false,
},
},
},
});
}).toWarnDev(
'[Autocomplete] The attribute "description" described by the path ["description"] does not exist on the hit. Did you set it in `attributesToHighlight`?' +
'\nSee https://www.algolia.com/doc/api-reference/api-parameters/attributesToHighlight/'
);
});

test('returns empty parts if the nested array attribute does not exist', () => {
expect(
parseAlgoliaHitHighlight({
attribute: ['title', 'description'],
hit: {
objectID: '1',
title: 'Hello there',
_snippetResult: {
title: {
value:
'__aa-highlight__He__/aa-highlight__llo t__aa-highlight__he__/aa-highlight__re',
},
},
},
})
).toEqual([]);
});

test('warns if the nested array attribute cannot be highlighted', () => {
expect(() => {
parseAlgoliaHitHighlight({
attribute: ['title', 'description'],
hit: {
objectID: '1',
title: 'Hello there',
description: 'Welcome all',
_highlightResult: {
title: {
noDescription: {
value:
'__aa-highlight__He__/aa-highlight__llo t__aa-highlight__he__/aa-highlight__re',
matchLevel: 'partial',
matchedWords: [],
fullyHighlighted: false,
},
},
},
},
});
}).toWarnDev(
'[Autocomplete] The attribute "title.description" described by the path ["title","description"] does not exist on the hit. Did you set it in `attributesToHighlight`?' +
'\nSee https://www.algolia.com/doc/api-reference/api-parameters/attributesToHighlight/'
);
});

test('warns if the nested array attribute containing a dot does not exist', () => {
expect(() => {
parseAlgoliaHitHighlight({
attribute: ['hierarchy', 'lvl1.inside'],
hit: {
objectID: '1',
hierarchy: {
'lvl0.inside': 'Hello there',
},
_highlightResult: {
hierarchy: {
'lvl0.inside': {
value:
'__aa-highlight__He__/aa-highlight__llo t__aa-highlight__he__/aa-highlight__re',
matchLevel: 'partial',
matchedWords: [],
fullyHighlighted: false,
},
},
},
},
});
}).toWarnDev(
'[Autocomplete] The attribute "hierarchy.lvl1.inside" described by the path ["hierarchy","lvl1.inside"] does not exist on the hit. Did you set it in `attributesToHighlight`?' +
'\nSee https://www.algolia.com/doc/api-reference/api-parameters/attributesToHighlight/'
);
});
Expand Down
Loading

0 comments on commit 4ad4e41

Please sign in to comment.