-
-
Save varkor/ca697f6fd59f60b5b9a8aeaa6d7cb341 to your computer and use it in GitHub Desktop.
| // ==UserScript== | |
| // @name WhatsApp Emoticon Preserver | |
| // @namespace https://gist.github.com/varkor/ca697f6fd59f60b5b9a8aeaa6d7cb341 | |
| // @version 0.5 | |
| // @author varkor | |
| // @description Disable automatic emoticon → emoji conversion in WhatsApp Web | |
| // @match https://web.whatsapp.com/ | |
| // @grant none | |
| // ==/UserScript== | |
| (() => { | |
| "use strict"; | |
| if (window.location.hostname !== "web.whatsapp.com") { | |
| window.location = "https://web.whatsapp.com/"; | |
| } else { | |
| const fixed = new Set(); | |
| const fix = function () { | |
| const input = document.querySelector('[data-tab="1"]'); | |
| if (input && !fixed.has(input)) { | |
| const volatile = new RegExp(["(y)", "(n)", ":-)", ":)", ":-(", ":(", ":-p", ":p", ":-|", ":|", ":-\\", ":-d", ":d", ":-*", "<3", "^_^", ">_<", ";-)"].map((string) => string.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, "\\$&")).join("|"), "gi"); | |
| input.addEventListener("input", (event) => { | |
| const selection = window.getSelection(); | |
| let containers = null; | |
| let start = null; | |
| let end = null; | |
| if (selection.rangeCount >= 1) { | |
| const range = selection.getRangeAt(0); | |
| containers = [range.startContainer, range.endContainer]; | |
| start = range.startOffset; | |
| end = range.endOffset; | |
| } | |
| const walker = document.createTreeWalker(input, NodeFilter.SHOW_TEXT); | |
| let node; | |
| while (node = walker.nextNode()) { | |
| node.nodeValue = node.nodeValue.replace(volatile, (match, offset) => { | |
| if (containers !== null) { | |
| if (containers[0] === node && start > offset) { | |
| start += Math.min(match.length - 1, start - offset); | |
| } | |
| if (containers[1] === node && end > offset) { | |
| end += Math.min(match.length - 1, end - offset); | |
| } | |
| } | |
| return match.split("").join("\u200B"); | |
| }); | |
| } | |
| if (containers !== null) { | |
| selection.removeAllRanges(); | |
| const range = document.createRange(); | |
| range.setStart(containers[0], start); | |
| range.setEnd(containers[1], end); | |
| selection.addRange(range); | |
| } | |
| }); | |
| fixed.add(input); | |
| } | |
| }; | |
| window.addEventListener("click", fix); | |
| window.addEventListener("paste", () => setTimeout(fix, 400)); | |
| fix(); | |
| } | |
| })(); |
@varkor Same experience here, though it's annoying enough that I stumbled upon your script. Oh well, time for me to contact their support, I guess :)
Is this also others' experience?
This drives me crazy. Same for people over on reddit.
@varkor yes backspace is possible, but as others commented it's very annoying. I tried to write a script myself a couple days ago but seems like they really don't want you to. It's easy to get a query selector to the input (which is now a role="textbox" div) via [data-tab="10"][role="textbox"] but any change will be reverted back instantly.
Can't someone write a script which will file a feedback report constantly? I have given feedback through all possible means but to no avail.
Edited it a bit to make it work for the new web WhatsApp. Can be found here:
https://gist.github.com/sakehl/4a843a22f7cdb58942d635784e8152c7
When I try typing an emoticon on WhatsApp web, it will automatically convert to an emoji, but if I press backspace, it will revert to the emoticon. It's still a little annoying, but at least it doesn't prevent the use of emoticons altogether. Is this also others' experience? If so, I personally am not so motivated to fix the issue, because it's easy enough to press backspace, and it would take some time to figure out how WhatsApp have modified their page structure in the meantime.