gmail.js icon indicating copy to clipboard operation
gmail.js copied to clipboard

Observer on the side panel?

Open ferreiro opened this issue 4 years ago • 3 comments

Hey team!

First, congrats for making this library, it's rock solid and super helpful!

I'm building an extension that adds a custom panel to the sidebar. I got that working by checking every X milliseconds if the sidebar exists, and if so, inject my custom panel. But I wanted to improve that since it's quite inefficient to run those checks (especially at the first load).

Is there any way to accomplish that with your library? If not, are there any ideas/insights on how to do it?

Screen Shot 2021-02-10 at 11 05 06 AM

ferreiro avatar Feb 10 '21 10:02 ferreiro

I'm building an extension that adds a custom panel to the sidebar. I got that working by checking every X milliseconds if the sidebar exists, and if so, inject my custom panel. But I wanted to improve that since it's quite inefficient to run those checks (especially at the first load).

Agreed.

Is there any way to accomplish that with your library?

Not currently.

If not, are there any ideas/insights on how to do it?

It's probably more efficient to use Mutation Observers for this, like we do for other DOM-based events.

If you can make that work, feel free to integrate it into the base library as a DOM-observer, and issue a PR :smiley:

josteink avatar Feb 11 '21 07:02 josteink

@josteink Actually I'd be more than happy if I have that working! Apart from reading the code, do you have any doc/video, etc explaining how does the library work and manages the state?

A couple of questions to understand how the library works:

  • I saw that you do the mutation observers, the tricky part about the sidebar is that it only appears if the sidebar is open. Do you create mutation observers for ALL the page, and then filter out the class selector you want to listen to?
  • If there is a node that doesn't appear, can you easily detect that with the mutation observers?

ferreiro avatar Feb 11 '21 09:02 ferreiro

I see that we actually do more than use MutationObservers. We also use a DOMNodeInserted-event (via jQuery), and that might be a better fit for this task:

https://github.com/KartikTalwar/gmail.js/blob/f5314db1d2e4c40adf6fd8c238b4532c89ba3a08/src/gmail.js#L2462-L2484

josteink avatar Feb 11 '21 10:02 josteink