<ReferenceInput>,< ReferenceArrayInput > ,<AutocompleteInput> validate required message not red as same as other input

[anewcoder1992]

What you were expecting:
when set validate={required()} in ReferenceInput or ReferenceArrayInput or AutocompleteInput

   <ReferenceInput label="Service Provider" source="serviceProviderId" reference="serviceProviders" validate={required()}>
        <AutocompleteInput optionText="name" />
      </ReferenceInput>

   <ReferenceArrayInput
        label="Eligible Services"
        source="eligibleServiceIds"
        reference="services"
        validate={required()}
      >
        <AutocompleteArrayInput optionText="name" />
      </ReferenceArrayInput>

  <AutocompleteInput source="timeZone" choices={timeZoneChoices} validate={required()} />

the validation message display style not a red color. At the same time ,ReferenceArrayInput and ReferenceInput do not have * after the label. AutocompleteInput have render the *

Environment

• React-admin version:3.0.0-beta.2

[djhi]

Have you updated to the latest beta ?

[anewcoder1992]

Have you updated to the latest beta ?

just Now i update to last beta2.0 ,but failed ,following is the error.

./node_modules/ra-core/esm/util/renderWithRedux.js
Module not found: Can't resolve '@testing-library/react' in '/Users/liuzhichao/AnewWork/cowboy-wms/node_modules/ra-core/esm/util'

my package.json

  "dependencies": {
    "apollo-cache-inmemory": "^1.6.3",
    "apollo-client": "^2.6.4",
    "apollo-link-context": "^1.0.19",
    "apollo-link-http": "^1.5.16",
    "graphql": "^14.5.8",
    "graphql-ast-types-browser": "^1.0.2",
    "http-proxy-middleware": "^0.20.0",
    "moment-timezone": "^0.5.27",
    "ra-data-graphql": "^2.9.6",
    "react": "^16.10.2",
    "react-admin": "^3.0.0-beta.2",
    "react-dom": "^16.10.2",
    "react-scripts": "3.2.0"
  }

can you please tell me why ? thanks

i found ra-core package.json "devDependencies": { "@redux-saga/testing-utils": "^1.0.2", "@testing-library/react": "^8.0.7", testing-library/react is install when in dev?

[djhi]

Yes, we just identified this issue. It will be corrected in next beta. In the mean time, you can install those deps yourself.

[anewcoder1992]

Yes, we just identified this issue. It will be corrected in next beta. In the mean time, you can install those deps yourself.

OK ，thank you very much @djhi

[anewcoder1992]

Yes, we just identified this issue. It will be corrected in next beta. In the mean time, you can install those deps yourself.

i have update to beta2.0 now.but the problem is still existing

[anewcoder1992]

@djhi have you reproduce my problem ? under beta2.0 , the problem is still existing

[fzaninotto]

I can't reproduce the problem with the next HEAD.

Please provide a CodeSandbox reproducing the problem.

[anewcoder1992]

@fzaninotto you should not use SelectInput in the ReferenceInput， i find maybe is the AutocompleteInput cause the problem , the same as AutocompleteArrayInput . if use AutocompleteArrayInput directly in the simpleForm. you can reproduce under following steps.

1. checkout to next
2. find file examples/simple/src/comments/CmommentCreate.js
3. add

    <ReferenceInput
                source="post_id"
                reference="posts"
                allowEmpty
                validate={required()}
                perPage={10000}
            >
                <AutocompleteInput optionText="title" />
            </ReferenceInput>
       <AutocompleteInput
                source="test"
                choices={[
                    { id: 'STORAGE', name: 'STORAGE' },
                    { id: 'TRANSFER', name: 'TRANSFER' },
                ]}
                validate={required()}
            />

to Create SimpleForm.
4.make run-simple and browser ”http://localhost:8080/#/comments/create“
related code

   <Create {...props}>
       <SimpleForm redirect={false} defaultValue={defaultValue}>
           <PostReferenceInput
               source="post_id"
               reference="posts"
               allowEmpty
               validate={required()}
               perPage={10000}
           />
           <ReferenceInput
               source="post_id"
               reference="posts"
               allowEmpty
               validate={required()}
               perPage={10000}
           >
               <AutocompleteInput optionText="title" />
           </ReferenceInput>
       <AutocompleteInput
               source="test"
               choices={[
                   { id: 'STORAGE', name: 'STORAGE' },
                   { id: 'TRANSFER', name: 'TRANSFER' },
               ]}
               validate={required()}
           />
       </SimpleForm>
   </Create>

[fzaninotto]

Confirmed and reproduced, thanks!

[anewcoder1992]

thanks @fzaninotto

[fzaninotto]

Fixed by #3857

[wmwart]

@fzaninotto, only part of the problem is fixed. No entry * ReferenceArrayInput and ReferenceInput with AutocompleteInput. Rather, * appears and then disappears:

In addition, as you can see, the default width for AutocompleteInput is different from the rest of the inputs

react-admin: "3.0.0-beta.6",

[fzaninotto]

@wmwart it seems the problem only occurs in AutocompleteInput. Would you mind opening a new issue, with a code snippet allowing to reproduce the bug?

[wmwart]

Done