Как на самом деле реализуются кликабельные элементы на современных веб-сайтах и ​​как я могу имитировать клики? - PullRequest
Новая
       64

Как на самом деле реализуются кликабельные элементы на современных веб-сайтах и ​​как я могу имитировать клики?

1 голос
/ 22 марта 2020

Я пытаюсь вычеркнуть все активные элементы из веб-страницы - такие как кнопки, ссылки и т. Д. c. Благодаря специальным функциям довольно легко найти то, что должно быть кликабельно. Однако многие кнопки имеют разную семантику.

Например, небольшая выдержка из страницы в Документах Google: 

<div
  id="alignRightButton"
  class="goog-toolbar-toggle-button goog-toolbar-button goog-inline-block"
  role="button"
  aria-disabled="false"
  aria-pressed="false"
  style="user-select: none;"
  aria-hidden="false"
  data-tooltip="Right align (⌘+Shift+R)"
  aria-label="Right align (⌘+Shift+R)"
>
  <div
    class="goog-toolbar-button-outer-box goog-inline-block"
    aria-hidden="true"
    style="user-select: none;"
  >
    <div
      class="goog-toolbar-button-inner-box goog-inline-block"
      style="user-select: none;"
    >
      <div class="docs-icon goog-inline-block " style="user-select: none;">
        <div
          class="docs-icon-img-container docs-icon-img docs-icon-align-right"
          aria-hidden="true"
          style="user-select: none;"
        >
          &nbsp;
        </div>
      </div>
    </div>
  </div>
</div>

Внешний div должен быть интерактивным, но я понятия не имею, как это клик обрабатывается. Вызов .click() для элемента, похоже, не активирует его функциональность, а также следующее: 

var simulateClick = function(elem) {
  var evt = new MouseEvent("click", {
    bubbles: true,
    cancelable: true,
    view: window
  });
  var canceled = !elem.dispatchEvent(evt);
};

Я также пытался добавить точки останова на странице при наведении мыши, но код слишком запутан, чтобы действительно расскажите, что происходит.

Итак, два вопроса:

1) Как "современные" сайты, такие как Google Docs, на самом деле обрабатывают клики?

2) Как программы чтения с экрана, которые Интерпретировать теги ARIA отправлять свои действия обратно на веб-страницу?

...