Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Disable hex4 and hex8 #461

Merged
merged 1 commit into from
Feb 17, 2018
Merged

Conversation

elvisvoer
Copy link
Collaborator

Closes #432

@@ -92,15 +92,15 @@ describe('helpers/color', () => {
})

describe('isValidHex', () => {
test('allows strings of length 3, 6, or 8', () => {
test('allows strings of length 3 or 6', () => {
expect(color.isValidHex('f')).toBeFalsy()
expect(color.isValidHex('ff')).toBeFalsy()
expect(color.isValidHex('fff')).toBeTruthy()
// expect(color.isValidHex('ffff')).toBeFalsy()
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey, you mind commenting this back in so that we have a guard for hex4 as well?

@elvisvoer
Copy link
Collaborator Author

@casesandberg great catch. I realised I was only taking colors with leading hash even though the test I modified was without. Fixed both implementation and uncommented assertion.

@casesandberg
Copy link
Owner

Wonderful @elvisvoer, thanks for your work on this!

@casesandberg casesandberg merged commit 669bf04 into casesandberg:master Feb 17, 2018
@casesandberg
Copy link
Owner

I've invited you to join the repo as a collaborator – no pressure to accept! Feel free to reach out with any questions.

@elvisvoer
Copy link
Collaborator Author

@casesandberg thanks for merging and for the invitation. I will reach out to you with questions for sure.

@casesandberg
Copy link
Owner

This is live in react-color@2.14.0 🎉

@@ -46,7 +46,9 @@ export default {
},

isValidHex(hex) {
return tinycolor(hex).isValid()
// disable hex4 and hex8
const lh = (String(hex).charAt(0) === '#') ? 1 : 0
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Minor point, but I'm curious: why isn't this hex[0] == '#'? Since length is checked, hex is expected to be a string.

Another alternative:

const len = hex.startsWith('#') ? hex.length - 1 : hex.length
return (len == 3 || len == 6) && tinycolor(hex).isValid()

By checking that length is 3 or 6, instead of NOT 4 or >6 (per the spec of this function), it won't matter if tinycolor later allows other lengths.

@elvisvoer elvisvoer deleted the disablehex8 branch June 19, 2020 09:28
@UnHumbleBen
Copy link

UnHumbleBen commented Jan 20, 2021

This is live in react-color@2.14.0

Can this be fixed in version 3.0.0 as well? I would like UMD bundle with this fix, and version 3 currently supports UMD. Otherwise, please make UMD bundle for version 2

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Chrome hex input bug
4 participants