From e50d6ee6eda32f0c23089bb65e38331841cdbc84 Mon Sep 17 00:00:00 2001
From: Raymond Hill <rhill@raymondhill.net>
Date: Sun, 21 May 2023 09:42:30 -0400
Subject: [PATCH] Fix sorting of lists in "Filter lists" pane

Related feedback:
- https://github.com/uBlockOrigin/uBlock-issues/issues/2645#issuecomment-1556090600
---
 src/css/common.css   | 2 +-
 src/js/3p-filters.js | 5 +++--
 src/js/i18n.js       | 7 +++----
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/css/common.css b/src/css/common.css
index a171904e5..dc7cd7e21 100644
--- a/src/css/common.css
+++ b/src/css/common.css
@@ -312,7 +312,7 @@ select {
 .countryFlag {
     height: var(--font-size);
     position: relative;
-    top: calc(var(--font-size) / 6);
+    top: calc(var(--font-size) / 7);
     width: calc(var(--font-size) * 1.4);
     }
 
diff --git a/src/js/3p-filters.js b/src/js/3p-filters.js
index ea568a977..515dc559c 100644
--- a/src/js/3p-filters.js
+++ b/src/js/3p-filters.js
@@ -173,9 +173,10 @@ const renderFilterLists = ( ) => {
         const listEntries = dom.clone('#templates .listEntries');
         const treeEntries = Object.entries(listTree);
         if ( depth !== 0 ) {
+            const reEmojis = /[\p{Emoji}]/gu;
             treeEntries.sort((a ,b) => {
-                const as = a[1].title || a[0];
-                const bs = b[1].title || b[0];
+                const as = (a[1].title || a[0]).replace(reEmojis, '');
+                const bs = (b[1].title || b[0]).replace(reEmojis, '');
                 return as.localeCompare(bs);
             });
         }
diff --git a/src/js/i18n.js b/src/js/i18n.js
index 44bf3762c..967b4036b 100644
--- a/src/js/i18n.js
+++ b/src/js/i18n.js
@@ -318,19 +318,18 @@ if ( isBackgroundProcess !== true ) {
             const match = reUnicodeFlags.exec(text);
             if ( match === null ) { break; }
             if ( match.index > i ) {
-                fragment.append(document.createTextNode(text.slice(i, match.index)));
+                fragment.append(text.slice(i, match.index));
             }
             const img = document.createElement('img');
             const countryCode = unicodeFlagToImageSrc.get(match[0]);
             img.src = `/img/flags-of-the-world/${countryCode}.png`;
             img.title = countryCode;
             img.classList.add('countryFlag');
-            fragment.append(img);
-            fragment.append(document.createTextNode('\u2009'));
+            fragment.append(img, '\u2009');
             i = reUnicodeFlags.lastIndex;
         }
         if ( i < text.length ) {
-            fragment.append(document.createTextNode(text.slice(i)));
+            fragment.append(text.slice(i));
         }
         return fragment; 
     };