search

morpherltd / russiangram-chrome-extension

0 stars 3 forks source link

Drop down menus not working when extension active #2

Closed bzaar closed 3 years ago

bzaar commented 3 years ago

A few users have noticed this strange bug:

Great idea for a plugin, I like it very much. However, it makes some dropdown menus in browser based tools like Jupyter Notebook not work, even when the plugin is not supposed to interfere with the web site, or activated. The problem was fixed when I uninstalled RussianGram.

Extremely useful, but with Chrome 85.0.4183.83 causes many website menus to fail. So If you're supposed to be able click a menu and see a drop down list of options to choose - nothing happens when you click the menu. It's just dead. I confirmed this by all extensions, re-enabling one by one and then once RussianGram was enabled, menu problem resumed.

masterWeber commented 3 years ago

This breaks any JS that is linked to HTML on the site. https://github.com/morpherltd/russiangram-chrome-extension/blob/ddab024ba4fffc7b331b140b2269cd7ac4f7e48f/js/wholepage.js#L8

bzaar commented 3 years ago

@masterWeber - thanks! Do you know how to fix it?

bzaar commented 3 years ago

Additional info from a user:

The issue is illustrated by an animation here: https://stackoverflow.com/q/35668929/1291717 I don't know if his problem is also because of RussianGram, but the "symptom" is exactly the same.

Feel free to ask, if you want me to send other details or test something!

masterWeber commented 3 years ago

@masterWeber - thanks! Do you know how to fix it?

Instead of replacing HTML completely, I suggest:

  1. Find all TextNodes;
  2. Set a uid for each.
  3. From their value form JSON like {"uid_text_node1": "text1", "uid_text_node2": "text2"};
  4. Send JSON to the server;
  5. When receiving a response, replace the values ​​of all TextNodes with new ones.
bzaar commented 3 years ago

This breaks any JS that is linked to HTML on the site. https://github.com/morpherltd/russiangram-chrome-extension/blob/ddab024ba4fffc7b331b140b2269cd7ac4f7e48f/js/wholepage.js#L8

Why do you think it breaks the JS? If you click the Matryoshka on this page e.g. https://morpher.ru/, the drop-down menus continue working:

image

bzaar commented 3 years ago

Although some JS does get broken, e.g. on this page https://morpher.ru/accentizer/ the "Copy all" button stops working.

Why does some JS get broken and some does not?

masterWeber commented 3 years ago

Although some JS does get broken, e.g. on this page https://morpher.ru/accentizer/ the "Copy all" button stops working.

Why does some JS get broken and some does not?

If the event handlers are specified in HTML then nothing will break.

Screenshot from 2021-03-10 18-38-22

bzaar commented 3 years ago

Ah! Finally, I see what you mean. Setting html.InnerHtml will remove any event handlers which were added dynamically, in JS code.

Okay, then your suggestion makes sense. Please go ahead and send down the JSON. We don't even need to change the backend for this to work. You will get back exactly the same JSON, with stress marks added. Just make sure you don't use Russian words as node IDs. ;)

bzaar commented 3 years ago

@masterWeber Thanks for the PR. It certainly fixes the issue that occurs when clicking the Matryoshka button. However, from users' comments I've got the impression that the issue occurred even without anyone clicking the Matryoshka button. Apprently, the drop downs are broken while the extension is active. Removing or disabling the extension fixes the drop downs. I have emailed one of the users asking for a specific page where this happens.

masterWeber commented 3 years ago

@bzaar The jQuery in Jupyter Notebook conflicts with the jQuery in the extension. I suggest getting rid of it.