Python 了解在 Selenium 中执行异步脚本

Understanding execute async script in Selenium

提问by alecxe

I've been using selenium(with python bindingsand through protractormostly) for a rather long time and every time I needed to execute a javascript code, I've used execute_script()method. For example, for scrolling the page(python):

我一直在使用selenium（使用python 绑定和protractor大部分时间）相当长的时间，每次我需要执行 javascript 代码时，我都使用了execute_script()方法。例如，滚动页面（python）：

driver.execute_script("window.scrollTo(0, document.body.scrollHeight);")

Or, for infinite scrolling inside an another element(protractor):

或者，在另一个元素（量角器）内无限滚动：

var div = element(by.css('div.table-scroll'));
var lastRow = element(by.css('table#myid tr:last-of-type'));

browser.executeScript("return arguments[0].offsetTop;", lastRow.getWebElement()).then(function (offset) {
    browser.executeScript('arguments[0].scrollTop = arguments[1];', div.getWebElement(), offset).then(function() {
        // assertions

    });
});

Or, for getting a dictionary of all element attributes(python):

或者，获取所有元素属性的字典（python）：

driver.execute_script('var items = {}; for (index = 0; index < arguments[0].attributes.length; ++index) { items[arguments[0].attributes[index].name] = arguments[0].attributes[index].value }; return items;', element)

---

---

But, WebDriver API also has execute_async_script()which I haven't personally used.

但是，WebDriver API 也有execute_async_script()我个人没有使用过的。

What use cases does it cover? When should I use execute_async_script()instead of the regular execute_script()?

它涵盖哪些用例？我什么时候应该使用execute_async_script()而不是常规的execute_script()？

^{The question is selenium-specific, but language-agnostic.}

^{这个问题是特定于硒的，但与语言无关。}

采纳答案by hankduan

Here's the referenceto the two APIs (well it's Javadoc, but the functions are the same), and here's an excerpt from it that highlights the difference

这是对两个 API的引用（嗯，它是 Javadoc，但功能是相同的），这是其中的摘录，突出了不同之处

[executeAsyncScript] Execute an asynchronous piece of JavaScript in the context of the currently selected frame or window. Unlike executing synchronous JavaScript, scripts executed with this method must explicitly signal they are finished by invoking the provided callback. This callback is always injected into the executed function as the last argument.

[executeAsyncScript] 在当前选定的框架或窗口的上下文中执行一段异步 JavaScript。与执行同步 JavaScript 不同，使用此方法执行的脚本必须通过调用提供的回调显式表示它们已完成。这个回调总是作为最后一个参数注入到执行的函数中。

Basically, execSync blocks further actions being performed by the selenium browser, while execAsync does not block and calls on a callbackwhen it's done.

基本上， execSync 会阻止 selenium 浏览器执行的进一步操作，而 execAsync 不会阻止并在callback完成后调用 a 。

---

---

Since you've worked with protractor, I'll use that as example. Protractor uses executeAsyncScriptin both getand waitForAngular

由于您使用过量角器，因此我将以此为例。量角器用途executeAsyncScript均get与waitForAngular

In waitForAngular, protractor needs to wait until angular announces that all events settled. You can't use executeScriptbecause that needs to return a value at the end (although I guess you can implement a busy loop that polls angular constantly until it's done). The way it works is that protractor provides a callback, which Angular calls once all events settled, and that requires executeAsyncScript. Code here

在 中waitForAngular，量角器需要等到 angular 宣布所有事件都已解决。你不能使用，executeScript因为它需要在最后返回一个值（虽然我猜你可以实现一个繁忙的循环，不断轮询 angular 直到它完成）。它的工作方式是量角器提供一个回调，一旦所有事件解决，Angular 就会调用它，这需要 executeAsyncScript。代码在这里

In get, protractor needs to poll the page until the global window.angularis set by Angular. One way to do it is driver.wait(function() {driver.executeScript('return window.angular')}, 5000), but that way protractor would pound at the browser every few ms. Instead, we do this (simplified):

在 中get，量角器需要轮询页面，直到window.angularAngular 设置了全局。一种方法是driver.wait(function() {driver.executeScript('return window.angular')}, 5000)，但这样量角器每隔几毫秒就会在浏览器上敲击。相反，我们这样做（简化）：

functions.testForAngular = function(attempts, callback) {
  var check = function(n) {
    if (window.angular) {
      callback('good');
    } else if (n < 1) {
      callback('timedout');
    } else {
      setTimeout(function() {check(n - 1);}, 1000);
    }
  };
  check(attempts);
};

Again, that requires executeAsyncScriptbecause we don't have a return value immediately. Code here

同样，这需要executeAsyncScript因为我们没有立即返回值。代码在这里

---

---

All in all, use executeAsyncScriptwhen you care about a return value in a calling script, but that return value won't be available immediately. This is especially necessary if you can't poll for the result, but must get the result using a callback or promise (which you must translate to callback yourself).

总而言之，executeAsyncScript当您关心调用脚本中的返回值时使用，但该返回值不会立即可用。如果您无询结果，但必须使用回调或承诺（您必须自己将其转换为回调）获取结果，则这尤其必要。

回答by Louis

When should I use execute_async_script()instead of the regular execute_script()?

我什么时候应该使用execute_async_script()而不是常规的execute_script()？

When it comes to checking conditions on the browser side, all checks you can perform with execute_async_scriptcan be performed with execute_script. Even if what you are checking is asynchronous.I know because once upon a time there was a bug with execute_async_scriptthat made my tests fail if the script returned results too quickly. As far as I can tell, the bug is gone now so I've been using execute_async_scriptbut for months beforehand, I used execute_scriptfor tasks where execute_async_scriptwould have been more natural. For instance, performing a check that requires loading a module with RequireJS to perform the check:

在浏览器端检查条件时，您可以执行的所有检查都可以execute_async_script使用execute_script. 即使您正在检查的是异步的。我知道，因为从前有一个错误，execute_async_script如果脚本返回结果太快，我的测试就会失败。据我所知，这个错误现在已经消失了，所以我一直在使用，execute_async_script但在几个月前，我用于更自然的execute_script任务execute_async_script。例如，执行需要使用 RequireJS 加载模块来执行检查的检查：

driver.execute_script("""
// Reset in case it's been used already.
window.__selenium_test_check = undefined;
require(["foo"], function (foo) {
    window.__selenium_test_check = foo.computeSomething();
});
""")

result = driver.wait(lambda driver: 
    driver.execute_script("return window.__selenium_test_check;"))

The requirecall is asynchronous. The problem with this though, besides leaking a variable into the global space, is that it multiplies the network requests. Each execute_scriptcall is a network request. The waitmethod works by polling: it runs the test until the returned value is true. This means one network request per check that waitperforms (in the code above).

该require调用是异步的。但是，除了将变量泄漏到全局空间之外，问题在于它会增加网络请求。每个execute_script调用都是一个网络请求。该wait方法通过轮询工作：它运行测试直到返回值为真。这意味着每次检查wait执行一个网络请求（在上面的代码中）。

When you test locally it is not a big deal. If you have to go through the network because you are having the browsers provisioned by a service like Sauce Labs (which I use, so I'm talking from experience), each network request slows down your test suite. So using execute_async_scriptnot only allows writing a test that looks more natural (call a callback, as we normally do with asynchronous code, rather than leak into the global space) but it also helps the performance of your tests.

当您在本地测试时，这没什么大不了的。如果您必须通过网络，因为您的浏览器是由 Sauce Labs 之类的服务提供的（我使用它，所以我是从经验中谈起的），每个网络请求都会减慢您的测试套件的速度。因此，使用execute_async_script不仅允许编写看起来更自然的测试（调用回调，就像我们通常对异步代码所做的那样，而不是泄漏到全局空间），而且还有助于测试的性能。

result = driver.execute_async_script("""
var done = arguments[0];
require(["foo"], function (foo) {
    done(foo.computeSomething());
});
""")

The way I see it now is that if a test is going to hook into asynchronous code on the browser side to get a result, I use execute_async_script. If it is going to do something for which there is no asynchronous method available, I use execute_script.

我现在看到的方式是，如果测试要挂接到浏览器端的异步代码中以获得结果，我会使用execute_async_script. 如果它要做一些没有可用异步方法的事情，我使用execute_script.