@patternfly/react-core 6.2.1-prerelease.0 → 6.2.1-prerelease.1

package/helpers/package.json

@@ -1 +1 @@
-{"name":"@patternfly/react-core-helpers","main":"../dist/js/helpers/index.js","module":"../dist/esm/helpers/index.js","typings":"../dist/esm/helpers/index.d.ts","version":"6.2.0","private":true}
+{"name":"@patternfly/react-core-helpers","main":"../dist/js/helpers/index.js","module":"../dist/esm/helpers/index.js","typings":"../dist/esm/helpers/index.d.ts","version":"6.2.1-prerelease.0","private":true}

package/layouts/package.json

@@ -1 +1 @@
-{"name":"@patternfly/react-core-layouts","main":"../dist/js/layouts/index.js","module":"../dist/esm/layouts/index.js","typings":"../dist/esm/layouts/index.d.ts","version":"6.2.0","private":true}
+{"name":"@patternfly/react-core-layouts","main":"../dist/js/layouts/index.js","module":"../dist/esm/layouts/index.js","typings":"../dist/esm/layouts/index.d.ts","version":"6.2.1-prerelease.0","private":true}

package/next/package.json

@@ -1 +1 @@
-{"name":"@patternfly/react-core-next","main":"../dist/js/next/index.js","module":"../dist/esm/next/index.js","typings":"../dist/esm/next/index.d.ts","version":"6.2.0","private":true}
+{"name":"@patternfly/react-core-next","main":"../dist/js/next/index.js","module":"../dist/esm/next/index.js","typings":"../dist/esm/next/index.d.ts","version":"6.2.1-prerelease.0","private":true}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@patternfly/react-core",
-  "version": "6.2.1-prerelease.0",
+  "version": "6.2.1-prerelease.1",
   "description": "This library provides a set of common React components for use with the PatternFly reference implementation.",
   "main": "dist/js/index.js",
   "module": "dist/esm/index.js",
@@ -63,5 +63,5 @@
     "react": "^17 || ^18",
     "react-dom": "^17 || ^18"
   },
-  "gitHead": "97ad43e3ca0bad9b75b9c5963d5d6e6de6895bbf"
+  "gitHead": "67083921690cf0fb228cc2cb5045a914f636706f"
 }

package/src/components/DatePicker/DatePicker.tsx

@@ -161,7 +161,9 @@ const DatePickerBase = (
   }, [value]);
 
   const applyValidators = (date: Date) => {
-    setErrorText(validators.map((validator) => validator(date)).join('\n') || '');
+    const validatorResults = validators.map((validator) => validator(date));
+    const validatorsToApply = validatorResults.filter((validator) => validator !== '');
+    setErrorText(validatorsToApply.join('\n') || '');
   };
 
   const onTextInput = (event: React.FormEvent<HTMLInputElement>, value: string) => {

package/src/components/DatePicker/__tests__/DatePicker.test.tsx

@@ -11,19 +11,57 @@ test('disabled date picker', () => {
   expect(asFragment()).toMatchSnapshot();
 });
 
-test('Date picker with multiple validators does not show invalid icon on valid input', async () => {
+test('Does not render aria-invalid input when multiple validators return empty strings', async () => {
   const user = userEvent.setup();
 
   const rangeValidator = (_date: Date) => '';
+  const rangeValidatorB = (_date: Date) => '';
+  render(<DatePicker value="2020-03-17" validators={[rangeValidator, rangeValidatorB]} />);
+
+  await user.click(screen.getByRole('textbox'));
+  await user.click(document.body);
+  expect(screen.getByRole('textbox')).not.toBeInvalid();
+});
 
+test('Does not render helper text when multiple validators return empty strings', async () => {
+  const user = userEvent.setup();
+
+  const rangeValidator = (_date: Date) => '';
   const rangeValidatorB = (_date: Date) => '';
+  render(<DatePicker value="2020-03-17" validators={[rangeValidator, rangeValidatorB]} />);
 
+  await user.click(screen.getByRole('textbox'));
+  await user.click(document.body);
+
+  expect(screen.queryByText(': error status;')).not.toBeInTheDocument();
+});
+
+test('Renders helper text when at least 1 validator returns a string', async () => {
+  const user = userEvent.setup();
+
+  const rangeValidator = (_date: Date) => 'Some error.';
+  const rangeValidatorB = (_date: Date) => '';
   render(<DatePicker value="2020-03-17" validators={[rangeValidator, rangeValidatorB]} />);
 
   await user.click(screen.getByRole('textbox'));
+  await user.click(document.body);
+
+  expect(screen.getByText('Some error.')).toBeVisible();
+  expect(screen.getByText(': error status;')).toBeInTheDocument();
+});
 
+test('Renders helper text when more than 1 validator returns a string', async () => {
+  const user = userEvent.setup();
+
+  const rangeValidator = (_date: Date) => 'Some error.';
+  const rangeValidatorB = (_date: Date) => 'Another error.';
+  render(<DatePicker value="2020-03-17" validators={[rangeValidator, rangeValidatorB]} />);
+
+  await user.click(screen.getByRole('textbox'));
   await user.click(document.body);
-  expect(screen.getByRole('textbox')).not.toBeInvalid();
+
+  expect(screen.getByText('Some error. Another error.')).toBeVisible();
+  expect(screen.getByText(': error status;')).toBeInTheDocument();
 });
 
 test('Error state can be cleared from outside', async () => {

package/src/components/DatePicker/__tests__/__snapshots__/DatePicker.test.tsx.snap

@@ -21,7 +21,7 @@ exports[`With popover opened 1`] = `
             <input
               aria-invalid="false"
               aria-label="Date picker"
-              data-ouia-component-id="OUIA-Generated-TextInputBase-4"
+              data-ouia-component-id="OUIA-Generated-TextInputBase-7"
               data-ouia-component-type="PF6/TextInput"
               data-ouia-safe="true"
               placeholder="YYYY-MM-DD"
@@ -37,7 +37,7 @@ exports[`With popover opened 1`] = `
             aria-haspopup="dialog"
             aria-label="Toggle date picker"
             class="pf-v6-c-button pf-m-control"
-            data-ouia-component-id="OUIA-Generated-Button-control-4"
+            data-ouia-component-id="OUIA-Generated-Button-control-7"
             data-ouia-component-type="PF6/Button"
             data-ouia-safe="true"
             type="button"
@@ -185,7 +185,7 @@ exports[`With popover opened 1`] = `
                       <input
                         aria-invalid="false"
                         aria-label="Select year"
-                        data-ouia-component-id="OUIA-Generated-TextInputBase-5"
+                        data-ouia-component-id="OUIA-Generated-TextInputBase-8"
                         data-ouia-component-type="PF6/TextInput"
                         data-ouia-safe="true"
                         type="number"