search

thewca / worldcubeassociation.org

All of the code that runs on worldcubeassociation.org
https://www.worldcubeassociation.org/
GNU General Public License v3.0
329 stars 176 forks source link

Search bar disappearing #6127

Closed Mollerz closed 3 years ago

Mollerz commented 3 years ago

I was trying to search for FMC Europe 2017 as I was discussing some competition happenings with a friend. I kept mistyping and the search bar kept disappearing. I'm not sure what is specifically causing it, but I can confirm searching for "ame" and "eur" cause this to happen. I suspect it might be that if there are too many results then this occurs, but I'm not sure.

Using the latest version of Chrome on Windows. I was able to repeat this issue on Edge too.

FinnIckler commented 3 years ago

I was able to recreate the bug on My side as well. This is the error in the console:

TypeError: Cannot read property 'name' of undefined
    at t.a (CountryFlag.js:14)
    at Ji (react-dom.production.min.js:3669)
    at ko (react-dom.production.min.js:6637)
    at gu (react-dom.production.min.js:6152)
    at mu (react-dom.production.min.js:6141)
    at au (react-dom.production.min.js:5882)
    at react-dom.production.min.js:2853
    at t.unstable_runWithPriority (scheduler.production.min.js:311)
    at Kl (react-dom.production.min.js:2818)
    at Gl (react-dom.production.min.js:2848)
lo @ react-dom.production.min.js:5060
CountryFlag.js:14 Uncaught (in promise) TypeError: Cannot read property 'name' of undefined
    at t.a (CountryFlag.js:14)
    at Ji (react-dom.production.min.js:3669)
    at ko (react-dom.production.min.js:6637)
    at gu (react-dom.production.min.js:6152)
    at mu (react-dom.production.min.js:6141)
    at au (react-dom.production.min.js:5882)
    at react-dom.production.min.js:2853
    at t.unstable_runWithPriority (scheduler.production.min.js:311)
    at Kl (react-dom.production.min.js:2818)
    at Gl (react-dom.production.min.js:2848)
FinnIckler commented 3 years ago

This seems to happen with FMC Europe as it has Country set to Europe and there is no country in the list of countries. See this file here https://github.com/thewca/worldcubeassociation.org/blob/8c1cc635edf0fb0b548f7e5199f8d416296f6122/WcaOnRails/app/webpacker/javascript/wca/CountryFlag.js

FinnIckler commented 3 years ago

Fixed by checking for the Multiple country ISOs first. Will test tomorrow.

viroulep commented 3 years ago

I think the fix should be in the countries.js.erb: somehow it only exports the real ones (which means some form must need only them). If we change this file to export all states, and provide an additional real collection for the form needing them, then I think no change is necessary in the react component (and most importantly: we won't have to hardcode names somewhere).

FinnIckler commented 3 years ago

This would be the cleaner option and also provide easier options for localisation. Do you have any idea where this is defined in ruby?

viroulep commented 3 years ago

Actually just to fix this there is nothing to do in ruby, it's just a matter of editing what is exported in the countries.js.erb file! For the i18n I wanted to check if it was as straightforward as for events and formats, and it turned out there was a small dependency issue (the js i18n pack was included after the search bar), so I submitted a PR: #6129.

It should fix both the issue @Mollerz reported and provide i18n for countries; feel free to edit it if you think it's missing something!

FinnIckler commented 3 years ago

Thanks for taking this on! Looks great