From 0ce614059e9534a9fcf41f0ca6da5592c45f597b Mon Sep 17 00:00:00 2001 From: Constance Chen Date: Thu, 10 Nov 2022 12:07:33 -0800 Subject: [PATCH 1/4] [REVERT ME] local docs for testing --- src-docs/src/views/search_bar/search_bar.js | 10 ++--- src-docs/src/views/tables/data_store.js | 48 ++++++++++----------- 2 files changed, 29 insertions(+), 29 deletions(-) diff --git a/src-docs/src/views/search_bar/search_bar.js b/src-docs/src/views/search_bar/search_bar.js index c586d45b537..46992817190 100644 --- a/src-docs/src/views/search_bar/search_bar.js +++ b/src-docs/src/views/search_bar/search_bar.js @@ -17,11 +17,11 @@ import { const random = new Random(); const tags = [ - { name: 'marketing', color: 'danger' }, - { name: 'finance', color: 'success' }, - { name: 'eng', color: 'success' }, - { name: 'sales', color: 'warning' }, - { name: 'ga', color: 'success' }, + { name: 'market ing', color: 'danger' }, + { name: 'fi@nance', color: 'success' }, + { name: 'eng!&$#%^', color: 'success' }, + { name: 's*a:les', color: 'warning' }, + { name: 'g\\a/', color: 'success' }, ]; const types = ['dashboard', 'visualization', 'watch']; diff --git a/src-docs/src/views/tables/data_store.js b/src-docs/src/views/tables/data_store.js index 6dcdc60b3f3..6c6228439f3 100644 --- a/src-docs/src/views/tables/data_store.js +++ b/src-docs/src/views/tables/data_store.js @@ -5,30 +5,30 @@ import { times } from '../../../../src/services/utils'; const random = new Random(); const createCountries = () => [ - { code: 'NL', name: 'Netherlands', flag: '🇳🇱' }, - { code: 'CZ', name: 'Czech Republic', flag: '🇨🇿' }, - { code: 'ZA', name: 'South Africa', flag: '🇿🇦' }, - { code: 'US', name: 'United States', flag: '🇺🇲' }, - { code: 'AU', name: 'Australia', flag: '🇦🇺' }, - { code: 'IL', name: 'Israel', flag: '🇮🇱' }, - { code: 'NO', name: 'Norway', flag: '🇳🇴' }, - { code: 'IT', name: 'Italy', flag: '🇮🇹' }, - { code: 'CA', name: 'Canada', flag: '🇨🇦' }, - { code: 'CG', name: 'Congo', flag: '🇨🇬' }, - { code: 'CL', name: 'Chile', flag: '🇨🇱' }, - { code: 'FJ', name: 'Fiji', flag: '🇫🇯' }, - { code: 'GB', name: 'United Kingdom', flag: '🇬🇧' }, - { code: 'GR', name: 'Greece', flag: '🇬🇷' }, - { code: 'HT', name: 'Haiti', flag: '🇭🇹' }, - { code: 'LB', name: 'Lebanon', flag: '🇱🇧' }, - { code: 'MM', name: 'Myanmar', flag: '🇲🇲' }, - { code: 'MX', name: 'Mexico', flag: '🇲🇽' }, - { code: 'NG', name: 'Nigeria', flag: '🇳🇬' }, - { code: 'SG', name: 'Singapore', flag: '🇸🇬' }, - { code: 'SO', name: 'Somalia', flag: '🇸🇴' }, - { code: 'TN', name: 'Tunisia', flag: '🇹🇳' }, - { code: 'VE', name: 'Venezuela', flag: '🇻🇪' }, - { code: 'ZM', name: 'Zambia', flag: '🇿🇲' }, + { code: 'NL@', name: 'Netherlands', flag: '🇳🇱' }, + { code: 'CZ@', name: 'Czech Republic', flag: '🇨🇿' }, + { code: 'ZA@', name: 'South Africa', flag: '🇿🇦' }, + { code: 'US@', name: 'United States', flag: '🇺🇲' }, + { code: 'AU@', name: 'Australia', flag: '🇦🇺' }, + { code: 'IL@', name: 'Israel', flag: '🇮🇱' }, + { code: 'NO@', name: 'Norway', flag: '🇳🇴' }, + { code: 'IT@', name: 'Italy', flag: '🇮🇹' }, + { code: 'CA@', name: 'Canada', flag: '🇨🇦' }, + { code: 'CG@', name: 'Congo', flag: '🇨🇬' }, + { code: 'CL@', name: 'Chile', flag: '🇨🇱' }, + { code: 'FJ@', name: 'Fiji', flag: '🇫🇯' }, + { code: 'GB@', name: 'United Kingdom', flag: '🇬🇧' }, + { code: 'GR@', name: 'Greece', flag: '🇬🇷' }, + { code: 'HT@', name: 'Haiti', flag: '🇭🇹' }, + { code: 'LB@', name: 'Lebanon', flag: '🇱🇧' }, + { code: 'MM@', name: 'Myanmar', flag: '🇲🇲' }, + { code: 'MX@', name: 'Mexico', flag: '🇲🇽' }, + { code: 'NG@', name: 'Nigeria', flag: '🇳🇬' }, + { code: 'SG@', name: 'Singapore', flag: '🇸🇬' }, + { code: 'SO@', name: 'Somalia', flag: '🇸🇴' }, + { code: 'TN@', name: 'Tunisia', flag: '🇹🇳' }, + { code: 'VE@', name: 'Venezuela', flag: '🇻🇪' }, + { code: 'ZM@', name: 'Zambia', flag: '🇿🇲' }, ]; const firstNames = [ From c5553858a283175f2f7a1422ee8cdad96715fd41 Mon Sep 17 00:00:00 2001 From: Constance Chen Date: Thu, 10 Nov 2022 15:11:24 -0800 Subject: [PATCH 2/4] Escape special characters that are not used for EQL syntax --- .../search_bar/query/default_syntax.test.ts | 27 +++++++++++++++++++ .../search_bar/query/default_syntax.ts | 6 ++++- 2 files changed, 32 insertions(+), 1 deletion(-) diff --git a/src/components/search_bar/query/default_syntax.test.ts b/src/components/search_bar/query/default_syntax.test.ts index 0064a45938d..d240b4bfb1e 100644 --- a/src/components/search_bar/query/default_syntax.test.ts +++ b/src/components/search_bar/query/default_syntax.test.ts @@ -639,6 +639,33 @@ describe('defaultSyntax', () => { expect(printedQuery).toBe(query); }); + describe('phrases with special characters', () => { + const wrappedSpecialChars = "~`!@#$%^&+={}[];',.?".split(''); + + wrappedSpecialChars.forEach((char) => { + test(`${char} should be wrapped in quotes`, () => { + const query = `user:("foo${char}bar")`; + + const ast = defaultSyntax.parse(query); + const printedQuery = defaultSyntax.print(ast); + expect(printedQuery).toBe(query); + }); + }); + + const unwrappedSpecialChars = ['\\"', '(', ')', '_', '-', ':', '*', '\\']; + + unwrappedSpecialChars.forEach((char) => { + test(`${char} should not be wrapped in quotes`, () => { + const query = `user:("foo${char}bar")`; + const expected = `user:(foo${char.replaceAll('\\', '')}bar)`; + + const ast = defaultSyntax.parse(query); + const printedQuery = defaultSyntax.print(ast); + expect(printedQuery).toBe(expected); + }); + }); + }); + test('single term or expression', () => { const query = 'f:(foo)'; const ast = defaultSyntax.parse(query); diff --git a/src/components/search_bar/query/default_syntax.ts b/src/components/search_bar/query/default_syntax.ts index f5579819fc0..4679a53e222 100644 --- a/src/components/search_bar/query/default_syntax.ts +++ b/src/components/search_bar/query/default_syntax.ts @@ -451,7 +451,11 @@ const printValue = (value: Value, options: ParseOptions) => { return value.toString(); } - if (value.length === 0 || value.match(/\s/) || value.toLowerCase() === 'or') { + if ( + value.length === 0 || + value.match(/[^\w\-_*:()"/\\]/) || // Escape spaces and special characters not used as syntax identifiers + value.toLowerCase() === 'or' + ) { return `"${escapePhraseValue(value)}"`; } From 4f43dfc364436a9d42f2f1eef25cd7ab6b7b9746 Mon Sep 17 00:00:00 2001 From: Constance Chen Date: Wed, 16 Nov 2022 12:20:32 -0800 Subject: [PATCH 3/4] changelog --- upcoming_changelogs/6356.md | 1 + 1 file changed, 1 insertion(+) create mode 100644 upcoming_changelogs/6356.md diff --git a/upcoming_changelogs/6356.md b/upcoming_changelogs/6356.md new file mode 100644 index 00000000000..2c5911e544b --- /dev/null +++ b/upcoming_changelogs/6356.md @@ -0,0 +1 @@ +- `EuiSearchBar` now automatically wraps special characters not used by query syntax in quotes From d412a0c6d02eeee8def2072fcd70e0a595af6b5d Mon Sep 17 00:00:00 2001 From: Constance Chen Date: Wed, 16 Nov 2022 12:20:43 -0800 Subject: [PATCH 4/4] Revert "[REVERT ME] local docs for testing" This reverts commit 0ce614059e9534a9fcf41f0ca6da5592c45f597b. --- src-docs/src/views/search_bar/search_bar.js | 10 ++--- src-docs/src/views/tables/data_store.js | 48 ++++++++++----------- 2 files changed, 29 insertions(+), 29 deletions(-) diff --git a/src-docs/src/views/search_bar/search_bar.js b/src-docs/src/views/search_bar/search_bar.js index 46992817190..c586d45b537 100644 --- a/src-docs/src/views/search_bar/search_bar.js +++ b/src-docs/src/views/search_bar/search_bar.js @@ -17,11 +17,11 @@ import { const random = new Random(); const tags = [ - { name: 'market ing', color: 'danger' }, - { name: 'fi@nance', color: 'success' }, - { name: 'eng!&$#%^', color: 'success' }, - { name: 's*a:les', color: 'warning' }, - { name: 'g\\a/', color: 'success' }, + { name: 'marketing', color: 'danger' }, + { name: 'finance', color: 'success' }, + { name: 'eng', color: 'success' }, + { name: 'sales', color: 'warning' }, + { name: 'ga', color: 'success' }, ]; const types = ['dashboard', 'visualization', 'watch']; diff --git a/src-docs/src/views/tables/data_store.js b/src-docs/src/views/tables/data_store.js index 6c6228439f3..6dcdc60b3f3 100644 --- a/src-docs/src/views/tables/data_store.js +++ b/src-docs/src/views/tables/data_store.js @@ -5,30 +5,30 @@ import { times } from '../../../../src/services/utils'; const random = new Random(); const createCountries = () => [ - { code: 'NL@', name: 'Netherlands', flag: '🇳🇱' }, - { code: 'CZ@', name: 'Czech Republic', flag: '🇨🇿' }, - { code: 'ZA@', name: 'South Africa', flag: '🇿🇦' }, - { code: 'US@', name: 'United States', flag: '🇺🇲' }, - { code: 'AU@', name: 'Australia', flag: '🇦🇺' }, - { code: 'IL@', name: 'Israel', flag: '🇮🇱' }, - { code: 'NO@', name: 'Norway', flag: '🇳🇴' }, - { code: 'IT@', name: 'Italy', flag: '🇮🇹' }, - { code: 'CA@', name: 'Canada', flag: '🇨🇦' }, - { code: 'CG@', name: 'Congo', flag: '🇨🇬' }, - { code: 'CL@', name: 'Chile', flag: '🇨🇱' }, - { code: 'FJ@', name: 'Fiji', flag: '🇫🇯' }, - { code: 'GB@', name: 'United Kingdom', flag: '🇬🇧' }, - { code: 'GR@', name: 'Greece', flag: '🇬🇷' }, - { code: 'HT@', name: 'Haiti', flag: '🇭🇹' }, - { code: 'LB@', name: 'Lebanon', flag: '🇱🇧' }, - { code: 'MM@', name: 'Myanmar', flag: '🇲🇲' }, - { code: 'MX@', name: 'Mexico', flag: '🇲🇽' }, - { code: 'NG@', name: 'Nigeria', flag: '🇳🇬' }, - { code: 'SG@', name: 'Singapore', flag: '🇸🇬' }, - { code: 'SO@', name: 'Somalia', flag: '🇸🇴' }, - { code: 'TN@', name: 'Tunisia', flag: '🇹🇳' }, - { code: 'VE@', name: 'Venezuela', flag: '🇻🇪' }, - { code: 'ZM@', name: 'Zambia', flag: '🇿🇲' }, + { code: 'NL', name: 'Netherlands', flag: '🇳🇱' }, + { code: 'CZ', name: 'Czech Republic', flag: '🇨🇿' }, + { code: 'ZA', name: 'South Africa', flag: '🇿🇦' }, + { code: 'US', name: 'United States', flag: '🇺🇲' }, + { code: 'AU', name: 'Australia', flag: '🇦🇺' }, + { code: 'IL', name: 'Israel', flag: '🇮🇱' }, + { code: 'NO', name: 'Norway', flag: '🇳🇴' }, + { code: 'IT', name: 'Italy', flag: '🇮🇹' }, + { code: 'CA', name: 'Canada', flag: '🇨🇦' }, + { code: 'CG', name: 'Congo', flag: '🇨🇬' }, + { code: 'CL', name: 'Chile', flag: '🇨🇱' }, + { code: 'FJ', name: 'Fiji', flag: '🇫🇯' }, + { code: 'GB', name: 'United Kingdom', flag: '🇬🇧' }, + { code: 'GR', name: 'Greece', flag: '🇬🇷' }, + { code: 'HT', name: 'Haiti', flag: '🇭🇹' }, + { code: 'LB', name: 'Lebanon', flag: '🇱🇧' }, + { code: 'MM', name: 'Myanmar', flag: '🇲🇲' }, + { code: 'MX', name: 'Mexico', flag: '🇲🇽' }, + { code: 'NG', name: 'Nigeria', flag: '🇳🇬' }, + { code: 'SG', name: 'Singapore', flag: '🇸🇬' }, + { code: 'SO', name: 'Somalia', flag: '🇸🇴' }, + { code: 'TN', name: 'Tunisia', flag: '🇹🇳' }, + { code: 'VE', name: 'Venezuela', flag: '🇻🇪' }, + { code: 'ZM', name: 'Zambia', flag: '🇿🇲' }, ]; const firstNames = [