reenable twemoji

components/Twemoji.vue

@@ -1,40 +1,34 @@
 <template>
-    <!-- twemoji disabled, testing Noto Emoji instead -->
-    <span>
-        <slot ref="source"></slot>
-    </span>
-    <!--
     <span>
         <span ref="source" v-show="false">
             <slot ref="source"></slot>
         </span>
         <span ref="target"></span>
     </span>
-    -->
 </template>
 
 <script>
-// import twemoji from 'twemoji';
+import twemoji from 'twemoji';
 
 export default {
-    // mounted() {
-    //     this.update();
-    //
-    //     const observer = new MutationObserver(this.update);
-    //     observer.observe(this.$refs.source, {
-    //         childList: true,
-    //         subtree: true
-    //     });
-    //     this.observer = observer;
-    // },
-    // beforeUnmount() {
-    //     this.observer.disconnect();
-    // },
-    // methods: {
-    //     update() {
-    //         this.$refs.target.innerHTML = twemoji.parse(this.$refs.source.innerHTML);
-    //     },
-    // },
+    mounted() {
+        this.update();
+
+        const observer = new MutationObserver(this.update);
+        observer.observe(this.$refs.source, {
+            childList: true,
+            subtree: true
+        });
+        this.observer = observer;
+    },
+    beforeUnmount() {
+        this.observer.disconnect();
+    },
+    methods: {
+        update() {
+            this.$refs.target.innerHTML = twemoji.parse(this.$refs.source.innerHTML);
+        },
+    },
 };
 </script>
 

src/parseMarkdown.js

@@ -1,4 +1,4 @@
-// import twemoji from 'twemoji';
+import twemoji from 'twemoji';
 
 const census_groups = {
     'location_poland': 'Osoby mieszkające w Polsce',
@@ -77,7 +77,7 @@ export default async function parseMarkdown(markdown) {
                 .replace(/<p>{census_groups}<\/p>(.+?)<p>{\/census_groups}<\/p>/gms, mainPlusDetails(census_groups, false))
                 .replace(/<p>{census_comparisons}<\/p>(.+?)<p>{\/census_comparisons}<\/p>/gms, mainPlusDetails(census_comparisons, true))
                 .replace(/{json=([^=}]+)=([^=}]+)}/g, fetchJson)
-                .replace(/<p>{twemoji}<\/p>(.+?)<p>{\/twemoji}<\/p>/gms, (_, c) => c) // twemoji.parse(c)
+                .replace(/<p>{twemoji}<\/p>(.+?)<p>{\/twemoji}<\/p>/gms, (_, c) => twemoji.parse(c))
             + '</div>'
         ;
         content = content.replace(/{table_of_contents}/g, generateToC(content));