fix: fixes #3692 - simple discriminator now bypasses isValid() calls in getMatchingOption and getClosestMatchingOption for improved performance

CHANGELOG.md

@@ -15,6 +15,13 @@ it according to semantic versioning. For example, if your PR adds a breaking cha
 should change the heading of the (upcoming) version to include a major version bump.
 
 -->
+# 5.12.3
+
+## @rjsf/utils
+
+- Added `getOptionMatchingSimpleDiscriminator()` function
+- `getMatchingOption` and `getClosestMatchingOption` now bypass `validator.isValid()` calls when simple discriminator is provided, fixing [#3692](https://github.com/rjsf-team/react-jsonschema-form/issues/3692)
+
 # 5.12.2
 
 ## @rjsf/core

packages/docs/docs/api-reference/utility-functions.md

@@ -296,6 +296,22 @@ Using the `schema`, `defaultType` and `options`, extract out the props for the `
 
 - InputPropsType: The extracted `InputPropsType` object
 
+### getOptionMatchingSimpleDiscriminator()
+
+Compares the value of `discriminatorField` within `formData` against the value of `discriminatorField` within schema for each `option`. Returns index of first `option` whose discriminator matches formData. Returns `undefined` if there is no match.
+
+This function does not work with discriminators of `"type": "object"` and `"type": "array"`
+
+#### Parameters
+
+- [formData]: T | undefined - The current formData, if any, used to figure out a match
+- options: S[] - The list of options to find a matching options from
+- [discriminatorField]: string | undefined - The optional name of the field within the options object whose value is used to determine which option is selected
+
+#### Returns
+
+- number | undefined: index of the matched option
+
 ### getSchemaType()
 
 Gets the type of a given `schema`.

packages/utils/src/getOptionMatchingSimpleDiscriminator.ts

@@ -0,0 +1,36 @@
+import get from 'lodash/get';
+import { PROPERTIES_KEY } from './constants';
+import { RJSFSchema, StrictRJSFSchema } from './types';
+
+export default function getOptionMatchingSimpleDiscriminator<T = any, S extends StrictRJSFSchema = RJSFSchema>(
+  formData: T | undefined,
+  options: S[],
+  discriminatorField?: string
+): number | undefined {
+  if (formData && discriminatorField) {
+    const value = get(formData, discriminatorField);
+
+    if (value === undefined) {
+      return;
+    }
+
+    for (let i = 0; i < options.length; i++) {
+      const option = options[i];
+      const discriminator = get(option, [PROPERTIES_KEY, discriminatorField], {});
+
+      if (discriminator.type === 'object' || discriminator.type === 'array') {
+        continue;
+      }
+
+      if (discriminator.const === value) {
+        return i;
+      }
+
+      if (discriminator.enum?.includes(value)) {
+        return i;
+      }
+    }
+  }
+
+  return;
+}

packages/utils/src/index.ts

@@ -49,6 +49,7 @@ import unwrapErrorHandler from './unwrapErrorHandler';
 import utcToLocal from './utcToLocal';
 import validationDataMerge from './validationDataMerge';
 import withIdRefPrefix from './withIdRefPrefix';
+import getOptionMatchingSimpleDiscriminator from './getOptionMatchingSimpleDiscriminator';
 
 export * from './types';
 export * from './enums';
@@ -79,6 +80,7 @@ export {
   findSchemaDefinition,
   getDiscriminatorFieldFromSchema,
   getInputProps,
+  getOptionMatchingSimpleDiscriminator,
   getSchemaType,
   getSubmitButtonOptions,
   getTemplate,

packages/utils/src/schema/getClosestMatchingOption.ts

@@ -1,5 +1,6 @@
 import get from 'lodash/get';
 import has from 'lodash/has';
+import isNumber from 'lodash/isNumber';
 import isObject from 'lodash/isObject';
 import isString from 'lodash/isString';
 import reduce from 'lodash/reduce';
@@ -11,6 +12,7 @@ import { ONE_OF_KEY, REF_KEY, JUNK_OPTION_ID, ANY_OF_KEY } from '../constants';
 import guessType from '../guessType';
 import { FormContextType, RJSFSchema, StrictRJSFSchema, ValidatorType } from '../types';
 import getDiscriminatorFieldFromSchema from '../getDiscriminatorFieldFromSchema';
+import getOptionMatchingSimpleDiscriminator from '../getOptionMatchingSimpleDiscriminator';
 
 /** A junk option used to determine when the getFirstMatchingOption call really matches an option rather than returning
  * the first item
@@ -147,6 +149,12 @@ export default function getClosestMatchingOption<
   const resolvedOptions = options.map((option) => {
     return resolveAllReferences(option, rootSchema);
   });
+
+  const simpleDiscriminatorMatch = getOptionMatchingSimpleDiscriminator(formData, options, discriminatorField);
+  if (isNumber(simpleDiscriminatorMatch)) {
+    return simpleDiscriminatorMatch;
+  }
+
   // Reduce the array of options down to a list of the indexes that are considered matching options
   const allValidIndexes = resolvedOptions.reduce((validList: number[], option, index: number) => {
     const testOptions: S[] = [JUNK_OPTION as S, option];

packages/utils/src/schema/getMatchingOption.ts

@@ -1,8 +1,10 @@
 import get from 'lodash/get';
 import has from 'lodash/has';
+import isNumber from 'lodash/isNumber';
 
 import { PROPERTIES_KEY } from '../constants';
 import { FormContextType, RJSFSchema, StrictRJSFSchema, ValidatorType } from '../types';
+import getOptionMatchingSimpleDiscriminator from '../getOptionMatchingSimpleDiscriminator';
 
 /** Given the `formData` and list of `options`, attempts to find the index of the option that best matches the data.
  * Deprecated, use `getFirstMatchingOption()` instead.
@@ -32,6 +34,12 @@ export default function getMatchingOption<
   if (formData === undefined) {
     return 0;
   }
+
+  const simpleDiscriminatorMatch = getOptionMatchingSimpleDiscriminator(formData, options, discriminatorField);
+  if (isNumber(simpleDiscriminatorMatch)) {
+    return simpleDiscriminatorMatch;
+  }
+
   for (let i = 0; i < options.length; i++) {
     const option = options[i];
 

packages/utils/test/getOptionMatchingSimpleDiscriminator.test.ts

@@ -0,0 +1,59 @@
+import getOptionMatchingSimpleDiscriminator from '../src/getOptionMatchingSimpleDiscriminator';
+
+describe('getOptionMatchingSimpleDiscriminator()', () => {
+  describe('returns undefined if no option matches discriminator', () => {
+    test('no options with no data', () => {
+      expect(getOptionMatchingSimpleDiscriminator({}, [], 'id')).toEqual(undefined);
+    });
+
+    test('no options with data', () => {
+      expect(getOptionMatchingSimpleDiscriminator({ foo: 'foo' }, [], 'id')).toEqual(undefined);
+    });
+
+    test('options with no data', () => {
+      expect(
+        getOptionMatchingSimpleDiscriminator({}, [{ type: 'object', properties: { foo: { const: 'foo' } } }], 'id')
+      ).toEqual(undefined);
+    });
+
+    test('matching property, but no discriminatorField', () => {
+      expect(
+        getOptionMatchingSimpleDiscriminator({ foo: 'foo' }, [
+          { type: 'object', properties: { foo: { const: 'foo' } } },
+        ])
+      ).toEqual(undefined);
+    });
+
+    test('matching property, but different discriminatorField', () => {
+      expect(
+        getOptionMatchingSimpleDiscriminator(
+          { foo: 'foo' },
+          [{ type: 'object', properties: { foo: { const: 'foo' } } }],
+          'bar'
+        )
+      ).toEqual(undefined);
+    });
+  });
+
+  describe('returns option index if option matches discriminator', () => {
+    test('const discriminator', () => {
+      expect(
+        getOptionMatchingSimpleDiscriminator(
+          { foo: 'foo' },
+          [{}, { type: 'object', properties: { foo: { const: 'foo' } } }],
+          'foo'
+        )
+      ).toEqual(1);
+    });
+
+    test('enum discriminator', () => {
+      expect(
+        getOptionMatchingSimpleDiscriminator(
+          { foo: 'foo' },
+          [{}, { type: 'object', properties: { foo: { enum: ['bar', 'foo'] } } }],
+          'foo'
+        )
+      ).toEqual(1);
+    });
+  });
+});