@telefonica/acceptance-testing 2.10.0 → 2.11.0

package/README.md

@@ -155,3 +155,14 @@ test('example screenshot test', async () => {
 
 You can also use globs for paths if you need: `api.spyOn('/some/*/path')`. We use the
 [`glob-to-regexp`](https://www.npmjs.com/package/glob-to-regexp) lib internally.
+
+## Uploading files
+
+Due to a puppeteer bug or limitation, when the chromium is dockerized, the file to upload must exist in the
+host and the container with the same path.
+
+A helper function `prepareFile` is provided to facilitate this:
+
+```js
+await elementHandle.uploadFile(prepareFile('/path/to/file'));
+```

package/dist/acceptance-testing.cjs.development.js

@@ -813,6 +813,9 @@ var _excluded = ["captureBeyondViewport"],
     _excluded2 = ["userAgent", "isDarkMode", "viewport", "cookies"];
 
 var _pkg$acceptanceTests, _ref;
+
+var execSync = /*#__PURE__*/require('child_process').execSync;
+
 var getGlobalBrowser = function getGlobalBrowser() {
   return global.browser;
 };
@@ -962,6 +965,18 @@ var normalizeSreenshotOptions = function normalizeSreenshotOptions(_temp2) {
   return _extends({}, options, {
     captureBeyondViewport: captureBeyondViewport
   });
+}; // Puppeteer already calls scrollIntoViewIfNeeded before clicking an element. But it doesn't work in all situations
+// For example, when there is a fixed footer in the page and the element to click is under it, the browser won't scroll
+// because the element is already in the viewport (the ifNeeded part is important here). By forcing the scroll to the
+// center, we manage to fix these edge cases.
+
+
+var scrollIntoView = function scrollIntoView(el) {
+  return el.evaluate(function (e) {
+    return e.scrollIntoView({
+      block: 'center'
+    });
+  });
 };
 
 var getPageApi = function getPageApi(page) {
@@ -973,9 +988,13 @@ var getPageApi = function getPageApi(page) {
         while (1) {
           switch (_context2.prev = _context2.next) {
             case 0:
+              _context2.next = 2;
+              return scrollIntoView(elementHandle);
+
+            case 2:
               return _context2.abrupt("return", elementHandle.type(text, options));
 
-            case 1:
+            case 3:
             case "end":
               return _context2.stop();
           }
@@ -994,9 +1013,13 @@ var getPageApi = function getPageApi(page) {
         while (1) {
           switch (_context3.prev = _context3.next) {
             case 0:
+              _context3.next = 2;
+              return scrollIntoView(elementHandle);
+
+            case 2:
               return _context3.abrupt("return", elementHandle.click(options));
 
-            case 1:
+            case 3:
             case "end":
               return _context3.stop();
           }
@@ -1020,13 +1043,17 @@ var getPageApi = function getPageApi(page) {
         while (1) {
           switch (_context4.prev = _context4.next) {
             case 0:
+              _context4.next = 2;
+              return scrollIntoView(elementHandle);
+
+            case 2:
               for (_len = _args4.length, values = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
                 values[_key - 1] = _args4[_key];
               }
 
               return _context4.abrupt("return", elementHandle.select.apply(elementHandle, values));
 
-            case 2:
+            case 4:
             case "end":
               return _context4.stop();
           }
@@ -1348,7 +1375,7 @@ var buildQueryMethods = function buildQueryMethods(_temp3) {
     var _Object$entries$_i = _Object$entries[_i],
         queryName = _Object$entries$_i[0],
         queryFn = _Object$entries$_i[1];
-    boundQueries[queryName] = /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee9() {
+    boundQueries[queryName] = /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee12() {
       var doc,
           body,
           _len2,
@@ -1357,25 +1384,25 @@ var buildQueryMethods = function buildQueryMethods(_temp3) {
           queryArgs,
           elementHandle,
           newElementHandle,
-          _args9 = arguments;
+          _args12 = arguments;
 
-      return runtime_1.wrap(function _callee9$(_context9) {
+      return runtime_1.wrap(function _callee12$(_context12) {
         while (1) {
-          switch (_context9.prev = _context9.next) {
+          switch (_context12.prev = _context12.next) {
             case 0:
-              _context9.next = 2;
+              _context12.next = 2;
               return pptrTestingLibrary.getDocument(page != null ? page : getGlobalPage());
 
             case 2:
-              doc = _context9.sent;
-              _context9.next = 5;
+              doc = _context12.sent;
+              _context12.next = 5;
               return doc.$('body');
 
             case 5:
-              body = _context9.sent;
+              body = _context12.sent;
 
-              for (_len2 = _args9.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
-                args[_key2] = _args9[_key2];
+              for (_len2 = _args12.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+                args[_key2] = _args12[_key2];
               }
 
               queryArgs = [].concat(args);
@@ -1390,11 +1417,11 @@ var buildQueryMethods = function buildQueryMethods(_temp3) {
                 });
               }
 
-              _context9.next = 11;
+              _context12.next = 11;
               return queryFn.apply(void 0, [element != null ? element : body].concat(queryArgs));
 
             case 11:
-              elementHandle = _context9.sent;
+              elementHandle = _context12.sent;
               newElementHandle = Object.create(elementHandle);
 
               newElementHandle.screenshot = /*#__PURE__*/function () {
@@ -1433,14 +1460,83 @@ var buildQueryMethods = function buildQueryMethods(_temp3) {
                 };
               }();
 
-              return _context9.abrupt("return", newElementHandle);
+              newElementHandle.click = /*#__PURE__*/function () {
+                var _ref19 = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee9(options) {
+                  return runtime_1.wrap(function _callee9$(_context9) {
+                    while (1) {
+                      switch (_context9.prev = _context9.next) {
+                        case 0:
+                          _context9.next = 2;
+                          return scrollIntoView(elementHandle);
+
+                        case 2:
+                          return _context9.abrupt("return", elementHandle.click(options));
+
+                        case 3:
+                        case "end":
+                          return _context9.stop();
+                      }
+                    }
+                  }, _callee9);
+                }));
+
+                return function (_x13) {
+                  return _ref19.apply(this, arguments);
+                };
+              }();
+
+              newElementHandle.type = /*#__PURE__*/function () {
+                var _ref20 = _asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee10(text, options) {
+                  return runtime_1.wrap(function _callee10$(_context10) {
+                    while (1) {
+                      switch (_context10.prev = _context10.next) {
+                        case 0:
+                          _context10.next = 2;
+                          return scrollIntoView(elementHandle);
+
+                        case 2:
+                          return _context10.abrupt("return", elementHandle.type(text, options));
+
+                        case 3:
+                        case "end":
+                          return _context10.stop();
+                      }
+                    }
+                  }, _callee10);
+                }));
+
+                return function (_x14, _x15) {
+                  return _ref20.apply(this, arguments);
+                };
+              }();
+
+              newElementHandle.select = /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee11() {
+                var _args11 = arguments;
+                return runtime_1.wrap(function _callee11$(_context11) {
+                  while (1) {
+                    switch (_context11.prev = _context11.next) {
+                      case 0:
+                        _context11.next = 2;
+                        return scrollIntoView(elementHandle);
+
+                      case 2:
+                        return _context11.abrupt("return", elementHandle.select.apply(elementHandle, _args11));
+
+                      case 3:
+                      case "end":
+                        return _context11.stop();
+                    }
+                  }
+                }, _callee11);
+              }));
+              return _context12.abrupt("return", newElementHandle);
 
-            case 15:
+            case 18:
             case "end":
-              return _context9.stop();
+              return _context12.stop();
           }
         }
-      }, _callee9);
+      }, _callee12);
     }));
   };
 
@@ -1462,55 +1558,86 @@ var within = function within(element) {
     element: element
   });
 };
-beforeEach( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee10() {
-  return runtime_1.wrap(function _callee10$(_context10) {
+beforeEach( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee13() {
+  return runtime_1.wrap(function _callee13$(_context13) {
     while (1) {
-      switch (_context10.prev = _context10.next) {
+      switch (_context13.prev = _context13.next) {
         case 0:
-          _context10.next = 2;
+          _context13.next = 2;
           return getGlobalPage().setRequestInterception(false);
 
         case 2:
-          _context10.next = 4;
+          _context13.next = 4;
           return global.jestPuppeteer.resetPage();
 
         case 4:
         case "end":
-          return _context10.stop();
+          return _context13.stop();
       }
     }
-  }, _callee10);
+  }, _callee13);
 })));
-afterEach( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee11() {
+afterEach( /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee14() {
   var page;
-  return runtime_1.wrap(function _callee11$(_context11) {
+  return runtime_1.wrap(function _callee14$(_context14) {
     while (1) {
-      switch (_context11.prev = _context11.next) {
+      switch (_context14.prev = _context14.next) {
         case 0:
-          _context11.prev = 0;
+          _context14.prev = 0;
           page = getGlobalPage();
           requestHandlers = [];
           needsRequestInterception = false;
           page.off('request', requestInterceptor); // clear tab, this way we clear the DOM and stop js execution or pending requests
 
-          _context11.next = 7;
+          _context14.next = 7;
           return page["goto"]('about:blank');
 
         case 7:
-          _context11.next = 11;
+          _context14.next = 11;
           break;
 
         case 9:
-          _context11.prev = 9;
-          _context11.t0 = _context11["catch"](0);
+          _context14.prev = 9;
+          _context14.t0 = _context14["catch"](0);
 
         case 11:
         case "end":
-          return _context11.stop();
+          return _context14.stop();
       }
     }
-  }, _callee11, null, [[0, 9]]);
+  }, _callee14, null, [[0, 9]]);
 })));
+/**
+ * Returns a new path to the file that can be used by chromium in acceptance tests
+ *
+ * To be able to use `element.uploadFile()` in a dockerized chromium, the file must exist in the
+ * host and the docker, and both sides must use the same path.
+ *
+ * To workaround this bug or limitation, this function prepares the file by copying it to /tmp in
+ * the host and the container.
+ */
+
+var prepareFile = function prepareFile(filepath) {
+  var isLocal = !isCi;
+  var isHeadless = !!process.env.HEADLESS;
+  var usesDocker = isLocal && isHeadless;
+  var dockerComposeFile = path.join(__dirname, '..', 'docker-compose.yaml');
+
+  if (usesDocker) {
+    var containerId = execSync("docker-compose -f " + dockerComposeFile + " ps -q").toString().trim();
+
+    if (!containerId) {
+      throw Error('acceptance-testing container not found');
+    }
+
+    execSync("docker cp " + filepath + " " + containerId + ":/tmp");
+    var newPath = path.join('/tmp', path.basename(filepath));
+    fs.copyFileSync(filepath, newPath);
+    return newPath;
+  } else {
+    return filepath;
+  }
+};
 
 exports.createApiEndpointMock = createApiEndpointMock;
 exports.getGlobalBrowser = getGlobalBrowser;
@@ -1519,6 +1646,7 @@ exports.getPageApi = getPageApi;
 exports.getScreen = getScreen;
 exports.interceptRequest = interceptRequest;
 exports.openPage = openPage;
+exports.prepareFile = prepareFile;
 exports.screen = screen;
 exports.serverHostName = serverHostName;
 exports.serverPort = serverPort;