I need help to create a new engine for a page that loads data with JavaScript.

[Omaeda]

I attempted to create an engine akin to IMDb ratings. The concept was to Ctrl + right-click the comments button on a post in 9gag.com, then hover over the engine to view the first comment. However, I discovered that the page loads content using JavaScript. I attempted to use #p{wait(elementId)} to wait until the content is displayed, but unfortunately, it’s still not functioning as expected.

This is the engine config:

{
        "name": "9gag comment preview",
        "url": "showTips:%t#p{wait(comment)}\n<div>{[data-index=\"0\"]}</div>",
        "icon": "https://9gag.com/favicon.ico",
        "kwFilter": "#comment$",
        "match": "https://9gag\\.com"
}

[hoothin]

No, you can't use #p{} in showTips.
I think using an iframe might be a better approach.

{
        "name": "🔗 Preview link",
        "url": "showTips:\n<style>\n.search-jumper-tips{\n    background:unset;\n    box-shadow:unset;\n    max-width: unset;\n    width: auto;\n}\n.search-jumper-tips * {\n    max-width: unset;\n    width: auto;\n}\n.search-jumper-tips iframe{\n    background: #f5f5f5e0;\n    box-shadow: 0px 0px 10px 0px #000;\n    width: 620px;\n    height: 500px;\n    resize: auto;\n}\n.search-jumper-tips [data-close] {\n    background: #00000066;\n    border-radius: 50%;\n    line-height: 20px;\n}\n</style>\n<span data-close>×</span>\n<iframe src=\"%t\"></iframe>"
}