如何使用JSDOM聚焦/单击YouTube的注释框

如何解决如何使用JSDOM聚焦/单击YouTube的注释框

1。上下文

我正在创建browser extension to enhance YouTube's keyboard navigation。我想到的快捷方式之一是评论 ¹ 。

_{1：我目前正在使用Dart，但它模仿JS，以后无论如何都会被转译为JS。}

2。我尝试过的

YouTube使用了许多自定义HTML元素，因此我尚不清楚什么有效以及何时起作用，最终我不得不对每次遇到自定义标签的情况进行反向工程。>

我基本上已经尝试过类似这样的事情：

document.querySelector('#labelAndInputContainer > div').click();

我应该改用focus()吗？

div#labelAndInputContainer元素一旦获得焦点，就会获得一个名为focused的新类。

3。其他可选挑战

最后一部分的讨论已重定向至this other question。

首先，YouTube不会在视频下方加载评论部分。仅当您向下滚动时，注释部分才会出现 ² 。那么，如何确定哪个事件触发了评论部分的加载？我该如何人为地发送它？ —否则，注释框的HTML元素将不存在。

我一直在使用getEventListeners()来确定哪些事件在哪些元素上起作用。

_{2：另一个示例是YouTube页面重新加载/导航到另一个页面，该页面由yt-navigate-start触发。}

---

您可能已经注意到，我不是JS专家，所以请随时了解基础知识或给我新手提示。

解决方法

当前，您可以使用其ID专注于评论输入：

document.getElementById("simplebox-placeholder").focus();

但是，只有当您向下翻页并等待其加载时，它才会加载。因此，请向下翻页并等待一段时间。

此外，根据窗口的宽度，您可能需要多次向下翻页。