rpf13 / sportsshooting_react

This repo is used for the Code Institute's Project Portfolio 5 with the main focus on creating the frontend application, which consumes the APIs of the sportsshooting_drf repo.
0 stars 1 forks source link

Bug: Error with controllID on Signin & SignUp Form #47

Closed rpf13 closed 1 year ago

rpf13 commented 1 year ago

When accessing the signIn and signUp form, I see the following errors in the console:

Warning: `controlId` is ignored on `<FormControl>` when `id` is specified. 
    at https://3000-rpf13-sportsshootingre-1ivdp0otp5o.ws-eu104.gitpod.io/static/js/vendors~main.chunk.js:14604:23
    at div
    at https://3000-rpf13-sportsshootingre-1ivdp0otp5o.ws-eu104.gitpod.io/static/js/vendors~main.chunk.js:14890:23
    at form
    at https://3000-rpf13-sportsshootingre-1ivdp0otp5o.ws-eu104.gitpod.io/static/js/vendors~main.chunk.js:14316:23
    at div
    at https://3000-rpf13-sportsshootingre-1ivdp0otp5o.ws-eu104.gitpod.io/static/js/vendors~main.chunk.js:13509:23
    at div
    at https://3000-rpf13-sportsshootingre-1ivdp0otp5o.ws-eu104.gitpod.io/static/js/vendors~main.chunk.js:13317:23
    at div
    at https://3000-rpf13-sportsshootingre-1ivdp0otp5o.ws-eu104.gitpod.io/static/js/vendors~main.chunk.js:17213:23
    at SignUpForm (https://3000-rpf13-sportsshootingre-1ivdp0otp5o.ws-eu104.gitpod.io/static/js/main.chunk.js:3801:74)
    at Route (https://3000-rpf13-sportsshootingre-1ivdp0otp5o.ws-eu104.gitpod.io/static/js/vendors~main.chunk.js:48488:29)
    at Switch (https://3000-rpf13-sportsshootingre-1ivdp0otp5o.ws-eu104.gitpod.io/static/js/vendors~main.chunk.js:48657:29)
    at div
    at https://3000-rpf13-sportsshootingre-1ivdp0otp5o.ws-eu104.gitpod.io/static/js/vendors~main.chunk.js:13509:23
    at div
    at App (https://3000-rpf13-sportsshootingre-1ivdp0otp5o.ws-eu104.gitpod.io/static/js/main.chunk.js:595:107)
    at CurrentUserProvider (https://3000-rpf13-sportsshootingre-1ivdp0otp5o.ws-eu104.gitpod.io/static/js/main.chunk.js:2558:3)
    at Router (https://3000-rpf13-sportsshootingre-1ivdp0otp5o.ws-eu104.gitpod.io/static/js/vendors~main.chunk.js:48169:30)
    at BrowserRouter (https://3000-rpf13-sportsshootingre-1ivdp0otp5o.ws-eu104.gitpod.io/static/js/vendors~main.chunk.js:47833:35)
rpf13 commented 1 year ago

This commit will fix a problem in the SignIn and SignUp form. Since I have added in an earlier step the htmlFor attribute and an id in each form field, this a duplicate with the already set controlID set. React Bootstrap will dynamically create the labels for this when set.

It is documented in https://react-bootstrap.netlify.app/docs/forms/form-control/

https://stackoverflow.com/questions/46776626/what-is-a-controlid-in-react-bootstrap

Therefore I did remove it again from these two forms. The other forms in my app do not have such a controllID, since I was not aware of the clear meaning up until the final testing.

commit id: dd93c06