JedWatson / JedWatson/react-select

Input on css is not valid.

Open
#5,351 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
28k
Forks
4.1k
PR merge metrics
No merged PRs in 30d

Description

Hey!
I am using the react-select in my project, and the W3 validator gives me this
Error: CSS: label: Property label doesn't exist.

From line 50, column 62128; to line 50, column 62549
-value=""><input type="text" class="reactSelect__input" style="label:input;color:inherit;background:0;opacity:…x="0" value="" aria-autocomplete="list" aria-expanded="false" aria-haspopup="true" role="combobox"/></div>

Referenced code is here:
https://github.com/JedWatson/react-select/blob/564a14306f3086a83b959ca89eaa909eeb4db77c/packages/react-select/src/components/Input.tsx#L81
https://github.com/JedWatson/react-select/blob/b0411ff46bc1ecf45d9bca4fb58fbce1e57f847c/packages/react-select/src/components/Input.js#L32

This is not valid css, and should not be there, to see more about css properties click.

This should be easy fix, and maybe you want to use aria-label?

Thanks!

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the referenced input implementations in packages/react-select/src/components/Input.tsx and packages/react-select/src/components/Input.js, especially the lines linked in the issue. Check the rendered input style against the W3C CSS validator. Done means the invalid CSS property is no longer emitted and the validator no longer reports this error.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Bug
Difficulty
1/5
Estimated time
Under an hour
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.