Allow searching for country names with diacritics (Shopify#3443)

Misha-Puff · Jul 1, 2024 · 6bd0c0e · 6bd0c0e
1 parent 46b02ac
commit 6bd0c0e
Showing 1 changed file with 9 additions and 2 deletions.
diff --git a/assets/localization-form.js b/assets/localization-form.js
@@ -138,8 +138,15 @@ if (!customElements.get('localization-form')) {
         }
       }
 
+      normalizeString(str) {
+        return str
+          .normalize('NFD')
+          .replace(/\p{Diacritic}/gu, '')
+          .toLowerCase();
+      }
+
       filterCountries() {
-        const searchValue = this.elements.search.value.toLowerCase();
+        const searchValue = this.normalizeString(this.elements.search.value);
         const popularCountries = this.querySelector('.popular-countries');
         const allCountries = this.querySelectorAll('a');
         let visibleCountries = allCountries.length;
@@ -151,7 +158,7 @@ if (!customElements.get('localization-form')) {
         }
 
         allCountries.forEach((item) => {
-          const countryName = item.querySelector('.country').textContent.toLowerCase();
+          const countryName = this.normalizeString(item.querySelector('.country').textContent);
           if (countryName.indexOf(searchValue) > -1) {
             item.parentElement.classList.remove('hidden');
             visibleCountries++;