[8.18] [DataViews] Improve fields matcher error handling (#233751) (#234762)

# Backport

This will backport the following commits from `main` to `8.18`:
- [[DataViews] Improve fields matcher error handling
(#233751)](#233751)

<!--- Backport version: 9.6.6 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sorenlouv/backport)

<!--BACKPORT [{"author":{"name":"Matthias
Polman","email":"[email protected]"},"sourceCommit":{"committedDate":"2025-09-11T13:28:01Z","message":"[DataViews]
Improve fields matcher error handling (#233751)\n\nImproving the
robustness and user experience of the source filter management UI and
its supporting utilities. The main focus is on better validation of
filter patterns, enhanced error handling for invalid user input, and
updating tests.\n\nCo-authored-by: Eyo Okon Eyo
<[email protected]>","sha":"643d364dc6b8fc70b82f6cb136740a08eaed4713","branchLabelMapping":{"^v9.2.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Feature:Data
Views","release_note:skip","Team:DataDiscovery","Team:SharedUX","backport:all-open","v9.2.0"],"title":"[DataViews]
Improve fields matcher error
handling","number":233751,"url":"https://github.com/elastic/kibana/pull/233751","mergeCommit":{"message":"[DataViews]
Improve fields matcher error handling (#233751)\n\nImproving the
robustness and user experience of the source filter management UI and
its supporting utilities. The main focus is on better validation of
filter patterns, enhanced error handling for invalid user input, and
updating tests.\n\nCo-authored-by: Eyo Okon Eyo
<[email protected]>","sha":"643d364dc6b8fc70b82f6cb136740a08eaed4713"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v9.2.0","branchLabelMappingKey":"^v9.2.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/233751","number":233751,"mergeCommit":{"message":"[DataViews]
Improve fields matcher error handling (#233751)\n\nImproving the
robustness and user experience of the source filter management UI and
its supporting utilities. The main focus is on better validation of
filter patterns, enhanced error handling for invalid user input, and
updating tests.\n\nCo-authored-by: Eyo Okon Eyo
<[email protected]>","sha":"643d364dc6b8fc70b82f6cb136740a08eaed4713"}}]}]
BACKPORT-->

---------

Co-authored-by: Matthias Polman <[email protected]>
Co-authored-by: Eyo Okon Eyo <[email protected]>
Co-authored-by: Matthias Polman <[email protected]>

Author: 3 people

src/platform/plugins/shared/data_view_management/public/components/edit_index_pattern/source_filters_table/components/add_filter/__snapshots__/add_filter.test.tsx.snap

@@ -8,35 +8,89 @@
  */
 
 import React from 'react';
-import { shallow } from 'enzyme';
-
+import { screen, render } from '@testing-library/react';
+import { userEvent } from '@testing-library/user-event';
+import { __IntlProvider as IntlProvider } from '@kbn/i18n-react';
 import { AddFilter } from './add_filter';
 
+type RenderAddFilterComponentProps = React.ComponentProps<typeof AddFilter>;
+
+const mockMakeRegExTest = jest.fn(() => true);
+
+jest.mock('@kbn/kibana-utils-plugin/common/field_wildcard', () => {
+  const originalModule = jest.requireActual('@kbn/kibana-utils-plugin/common/field_wildcard');
+  return {
+    ...originalModule,
+    makeRegEx: () => {
+      return {
+        test: mockMakeRegExTest,
+      } as unknown as RegExp;
+    },
+  };
+});
+
+const renderAddFilterComponent = (
+  { onAddFilter }: RenderAddFilterComponentProps = { onAddFilter: jest.fn() }
+) => {
+  return render(
+    <IntlProvider locale="en">
+      <AddFilter onAddFilter={onAddFilter} />
+    </IntlProvider>
+  );
+};
+
 describe('AddFilter', () => {
-  test('should render normally', () => {
-    const component = shallow(<AddFilter onAddFilter={() => {}} />);
+  test('should render normally', async () => {
+    renderAddFilterComponent();
 
-    expect(component).toMatchSnapshot();
+    expect(screen.getByTestId('fieldFilterInput')).toBeVisible();
   });
 
   test('should allow adding a filter', async () => {
+    const user = userEvent.setup();
     const onAddFilter = jest.fn();
-    const component = shallow(<AddFilter onAddFilter={onAddFilter} />);
-
-    component.find('EuiFieldText').simulate('change', { target: { value: 'tim*' } });
-    component.find('EuiButton').simulate('click');
-    component.update();
+    renderAddFilterComponent({ onAddFilter });
 
+    await user.type(screen.getByTestId('fieldFilterInput'), 'tim*');
+    await user.click(screen.getByText('Add'));
     expect(onAddFilter).toBeCalledWith('tim*');
   });
 
-  test('should ignore strings with just spaces', () => {
-    const component = shallow(<AddFilter onAddFilter={() => {}} />);
+  test('should ignore strings with just spaces', async () => {
+    const user = userEvent.setup();
+    const onAddFilter = jest.fn();
+
+    renderAddFilterComponent({ onAddFilter });
 
     // Set a value in the input field
-    component.find('EuiFieldText').simulate('keypress', ' ');
-    component.update();
+    await user.type(screen.getByTestId('fieldFilterInput'), ' ');
+    await user.click(screen.getByText('Add'));
+    expect(onAddFilter).not.toBeCalled();
+  });
+
+  test('should handle errors with invalid filter patterns', async () => {
+    const user = userEvent.setup();
+
+    // Simulate makeRegEx throwing an error for invalid regex
+    mockMakeRegExTest.mockImplementationOnce(() => {
+      throw new Error('Invalid regex');
+    });
+
+    renderAddFilterComponent();
+
+    // Set a value in the input field, we know this will be regarded as invalid because of the mock above
+    await user.type(screen.getByTestId('fieldFilterInput'), '*//foo');
+    // Trigger the blur event to validate the input
+    await user.tab();
+
+    expect(await screen.findByTestId('fieldFilterInput')).toHaveAttribute('aria-invalid', 'true');
+    expect(screen.getByTestId('addFieldFilterButton')).toBeDisabled();
+
+    // This would be regarded as a valid regex
+    await user.type(screen.getByTestId('fieldFilterInput'), '*//foo');
+    await user.tab();
 
-    expect(component).toMatchSnapshot();
+    expect(await screen.findByTestId('fieldFilterInput')).not.toHaveAttribute('aria-invalid');
+    expect(screen.getByTestId('addFieldFilterButton')).not.toBeDisabled();
   });
 });

src/platform/plugins/shared/data_view_management/public/components/edit_index_pattern/source_filters_table/components/add_filter/add_filter.test.tsx

@@ -11,6 +11,7 @@ import React, { useState, useCallback } from 'react';
 
 import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n-react';
+import { makeRegEx } from '@kbn/kibana-utils-plugin/common';
 import { EuiFlexGroup, EuiFlexItem, EuiFieldText, EuiButton } from '@elastic/eui';
 
 interface AddFilterProps {
@@ -26,28 +27,59 @@ const sourcePlaceholder = i18n.translate(
 );
 
 export const AddFilter = ({ onAddFilter }: AddFilterProps) => {
-  const [filter, setFilter] = useState<string>('');
+  const [filter, setFilter] = useState('');
+  const [isInvalid, setIsInvalid] = useState(false);
+
+  const isAddButtonDisabled = filter.length === 0 || isInvalid;
 
   const onAddButtonClick = useCallback(() => {
     onAddFilter(filter);
     setFilter('');
   }, [filter, onAddFilter]);
 
+  const onInputChange = useCallback(
+    (e: React.ChangeEvent<HTMLInputElement>) => {
+      const value = e.target.value.trim();
+      setFilter(value);
+    },
+    [setFilter]
+  );
+
+  const onInputBlur = useCallback((e: React.FocusEvent<HTMLInputElement>) => {
+    const value = e.target.value.trim();
+
+    if (value.length === 0) {
+      setIsInvalid(true);
+      return;
+    }
+
+    try {
+      // test value is not important, just that the created regex is able to compile
+      makeRegEx(value).test('');
+      setIsInvalid(false);
+    } catch (_) {
+      setIsInvalid(true);
+      return;
+    }
+  }, []);
+
   return (
     <EuiFlexGroup>
       <EuiFlexItem grow={10}>
         <EuiFieldText
           fullWidth
           value={filter}
           data-test-subj="fieldFilterInput"
-          onChange={(e) => setFilter(e.target.value.trim())}
+          isInvalid={isInvalid}
+          onBlur={onInputBlur}
+          onChange={onInputChange}
           placeholder={sourcePlaceholder}
         />
       </EuiFlexItem>
       <EuiFlexItem>
         <EuiButton
           data-test-subj="addFieldFilterButton"
-          isDisabled={filter.length === 0}
+          isDisabled={isAddButtonDisabled}
           onClick={onAddButtonClick}
         >
           <FormattedMessage

src/platform/plugins/shared/data_view_management/public/components/edit_index_pattern/source_filters_table/components/add_filter/add_filter.tsx

@@ -8,6 +8,7 @@
  */
 
 import { fieldWildcardFilter, makeRegEx } from './field_wildcard';
+import { fieldWildcardMatcher } from './field_wildcard';
 
 describe('fieldWildcard', () => {
   const metaFields = ['_id', '_type', '_source'];
@@ -72,5 +73,14 @@ describe('fieldWildcard', () => {
 
       expect(original.filter(filter)).toEqual([null, 'bar', {}, [], 'baz']);
     });
+
+    it('logs and safely handles invalid glob inputs (non-string) without throwing', function () {
+      const consoleSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
+      // Pass a non-string value to trigger the try/catch path inside fieldWildcardMatcher
+      const matcher = fieldWildcardMatcher([null as unknown as string], metaFields);
+      expect(() => matcher('foo')).not.toThrow();
+      expect(consoleSpy).toHaveBeenCalled();
+      consoleSpy.mockRestore();
+    });
   });
 });

src/platform/plugins/shared/kibana_utils/common/field_wildcard.test.ts

@@ -17,12 +17,18 @@ export const makeRegEx = memoize(function makeRegEx(glob: string) {
 
 // Note that this will return an essentially noop function if globs is undefined.
 export function fieldWildcardMatcher(globs: string[] = [], metaFields: unknown[] = []) {
-  return function matcher(val: unknown) {
+  return function matcher(val: unknown): boolean {
     // do not test metaFields or keyword
     if (metaFields.indexOf(val) !== -1) {
       return false;
     }
-    return globs.some((p) => makeRegEx(p).test(`${val}`));
+    try {
+      return globs.some((p) => makeRegEx(p).test(String(val)));
+    } catch (e) {
+      // eslint-disable-next-line no-console
+      console.error(e.toString());
+      return false;
+    }
   };
 }
 

src/platform/plugins/shared/kibana_utils/common/field_wildcard.ts

@@ -8,7 +8,7 @@
  */
 
 export { Defer, defer } from './defer';
-export { fieldWildcardMatcher, fieldWildcardFilter } from './field_wildcard';
+export { fieldWildcardMatcher, fieldWildcardFilter, makeRegEx } from './field_wildcard';
 export { of } from './of';
 export type {
   BaseState,