Simulating clicking on the objects

[peak helm]

I'm writing an extension, work of that need to click on the objects to get info (opening hidden lists) and then close them. They opens but doesn't close. I closing them by selecting an element generated with opened list and clicking on them. Don't ask me how, but when i paste code selecting and clicking on it in console it works. But after some tests i see output like last list is still open after finish and in some moment 2 lists opened at one time. I have code like this: ts el.addEventListener('click', (e) => { console.log("opened"); }); el.click(); // opening the list console.log("processing start") //processing console.log("processing end"); const closer = getListCloser(); closer.addEventListener('click', (e) => { console.log("closed"); }); closer.click()
And console seem like on screenshot, without any errors

[short leaf]

any way you can share a (minimal) reproduction of the issue?

[peak helm]

the only idea i have is to sent a site and a processing code

[short leaf]

sure, you could use something like https://codepen.io/pen/ to do that. if possible though please just share a small example showing this specific thing, not like you entire project

[peak helm]

in the site seems like using compiled react code, so i'm not really sure i can find out what the hell happens in the site and reproduce it. if u tell me, how 2 get the entire code of click event listeners of the certain object i'll fully reproduce it

[short leaf]

is it someone else's code?

or like you're trying to automate actions on someone else's website via a bookmarklet or whatnot?

ah you did say "extension", so you're writing a browser extension?

is it for chrome or firefox or what?

[peak helm]

yeah

[peak helm]

chrome

[short leaf]

so it seems like this isn't really a typescript question (it has nothing to do with types) and on top of that i don't really know anything about developing chrome extensions, so you might have to wait for someone else or find another more relevant forum to ask this question on

my general suggestion would be to step through the code using a debugger so you can see what exactly is happening each step of the way

[peak helm]

it's a difficulty when u make an extension: u can't use debugger, all is in the browser. u can oly put some data output every line

[short leaf]

i found that hard to believe so did a quick web search and found this: https://developer.chrome.com/docs/extensions/get-started/tutorial/debug

skimming that, i guess it doesn't really talk about breakpoints

anyway, assuming there are no issues with permissions or whatever, i would think that there wouldn't be any relevant difference running your code as a part of the webpage vs in an extension. this might sound dumb but maybe you can open the webpage in question and paste your code into the web developer console to experiment?

[peak helm]

i remember this page and don't remember about brakpoints here. i'll read itagain

[peak helm]

this might sound dumb but maybe you can open the webpage in question and paste your code into the web developer console to experiment?
i already did it and write about it in the topic

[short leaf]

ah. sorry but it's hard to understand your post given how it's written. i thought "when i paste code selecting and clicking" meant something that was happening on the page itself (my guess was that you were trying to interact with a web-based code editor of some kind)

[peak helm]

you're right

[short leaf]

another guess: your code is running too soon, before the DOM is ready? i don't really know anything about extension lifecycles but that's a pretty common mistake when people are writing code in normal <script> tags

or similarly: they are replacing/recycling elements on the page. so the element(s) you're attaching listeners to are not there when you need them to be

(but this is all just mostly-ignorant guesses on my part. i'll again suggest posting this question in a more relevant place. i don't have recs but i bet there are discord server specifically oriented around web extension development)

[peak helm]

no, i have a controller with buttons "execute" and "read". "execute" inserts the code in page, so i can send messages to get response and "read" sends message registered by "execute"

[peak helm]

i had looked for them but didn't found

[short leaf]

here's the official recommendations: https://developer.chrome.com/docs/extensions/support/get-help (but there might be unofficial communities too)

found this too: https://www.reddit.com/r/chrome_extensions/comments/187m85b/new_discord_server_for_browser_extension/

[peak helm]

anyway, thx, u did all u could