playwright-session
Version:
Visual Debugger for Playwright automation.
262 lines • 14.3 kB
JavaScript
;
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
Object.defineProperty(exports, "__esModule", { value: true });
var fs = require("fs");
/**
* Bootstraps session recording on top of the open browser connection.
* Session recording will be saved to a file defined by `sessionFilePath` argument.
* Once bootstrapped, this function will return a new BrowserContext & Page.
* @param browser ChromiumBrowser Browser instance.
* @param [sessionFilePath] [OPTIONAL] Path where session recoeding file should be saved.
* Defaults to `${process.cwd()}/playwright-events-${new Date().toISOString()}.ldjson`.
* @param contextOpts [OPTIONAL] Options that can be passed to `browser.newContext` call, used when creating new BrowserContext.
*/
function initializeRecorder(browser, sessionFilePath, contextOpts) {
if (contextOpts === void 0) { contextOpts = undefined; }
return __awaiter(this, void 0, void 0, function () {
function generateFnProxyHandler(label, origTarget, writer) {
return {
apply: function (target, thisArg, argumentsList) {
var thisActionId = ++actionId;
var stack = new Error().stack;
var calleePath = stack === null || stack === void 0 ? void 0 : stack.split(" at ").slice(2)[0].trim();
var _a = (calleePath || "").split(":"), url = _a[0], line = _a[1], column = _a[2];
var callee = {
functionName: label,
arguments: argumentsList,
url: url,
line: line,
column: column,
actionId: thisActionId,
};
writer.write("{\"direction\": \"action_start\", \"value\": " + JSON.stringify(callee) + ", \"timestamp\": " + Date.now() + "}\n");
function promiseHandler(q) {
var response = {
functionName: label,
arguments: argumentsList,
url: url,
line: line,
column: column,
actionId: thisActionId,
};
writer.write("{\"direction\": \"action_end\", \"value\": " + JSON.stringify(response) + ", \"timestamp\": " + Date.now() + "}\n");
return q;
}
var result = Reflect.apply(target, origTarget, argumentsList);
return Promise.resolve(result).then(promiseHandler, promiseHandler);
},
};
}
function generateObjectProxyHandler(label) {
return {
get: function (target, name) {
if (typeof target[name] === "function") {
return new Proxy(target[name], generateFnProxyHandler(label + "." + name, target, writer));
}
return target[name];
},
};
}
var writer, br, originalObj, wsOnMessageProxyHandler, wsSendProxyHandler, context, actionId, newPageProxyHandler, page, client;
var _this = this;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (sessionFilePath) {
writer = fs.createWriteStream(sessionFilePath + ".ldjson");
}
else {
writer = fs.createWriteStream(process.cwd() + "/playwright-session-events-" + new Date().toISOString() + ".ldjson");
}
br = browser;
originalObj = br._connection._transport;
wsOnMessageProxyHandler = {
apply: function (target, thisArg, argumentsList) {
writer.write("{\"direction\": \"receive\", \"value\": " + JSON.stringify(argumentsList[0]) + ", \"timestamp\": " + Date.now() + "}\n");
return Reflect.apply(target, thisArg, argumentsList);
},
};
wsSendProxyHandler = {
apply: function (target, thisArg, argumentsList) {
writer.write("{\"direction\": \"send\", \"value\": " + JSON.stringify(argumentsList[0]) + ", \"timestamp\": " + Date.now() + "}\n");
return Reflect.apply(target, thisArg, argumentsList);
},
};
originalObj.onmessage = new Proxy(originalObj.onmessage, wsOnMessageProxyHandler);
originalObj.send = new Proxy(originalObj.send, wsSendProxyHandler);
return [4 /*yield*/, browser.newContext(contextOpts)];
case 1:
context = _a.sent();
actionId = 0;
newPageProxyHandler = {
apply: function (target, thisArg, argumentsList) {
return Reflect.apply(target, thisArg, argumentsList).then(function (q) {
return new Proxy(q, generateObjectProxyHandler("Page"));
});
},
};
return [4 /*yield*/, context.newPage()];
case 2:
page = _a.sent();
return [4 /*yield*/, context.newCDPSession(page)];
case 3:
client = _a.sent();
client.on("Page.screencastFrame", function () { });
client.on("DOM.setChildNodes", function (result) { return __awaiter(_this, void 0, void 0, function () {
var nodeIds, _i, nodeIds_1, nodeId;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
nodeIds = getAllNodeIds({
nodeId: result.parentId,
children: result.nodes,
});
_i = 0, nodeIds_1 = nodeIds;
_a.label = 1;
case 1:
if (!(_i < nodeIds_1.length)) return [3 /*break*/, 4];
nodeId = nodeIds_1[_i];
return [4 /*yield*/, client
.send("DOM.getBoxModel", {
nodeId: nodeId,
})
.catch(function () { })];
case 2:
_a.sent();
_a.label = 3;
case 3:
_i++;
return [3 /*break*/, 1];
case 4: return [2 /*return*/];
}
});
}); });
client.on("DOM.documentUpdated", function () { return __awaiter(_this, void 0, void 0, function () {
var result, nodeIds, _i, nodeIds_2, nodeId;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, client.send("DOM.getDocument")];
case 1:
result = _a.sent();
return [4 /*yield*/, client.send("DOM.requestChildNodes", {
nodeId: result.root.nodeId,
depth: -1,
pierce: true,
})];
case 2:
_a.sent();
nodeIds = getAllNodeIds(result.root);
_i = 0, nodeIds_2 = nodeIds;
_a.label = 3;
case 3:
if (!(_i < nodeIds_2.length)) return [3 /*break*/, 6];
nodeId = nodeIds_2[_i];
return [4 /*yield*/, client
.send("DOM.getBoxModel", {
nodeId: nodeId,
})
.catch(function () { })];
case 4:
_a.sent();
_a.label = 5;
case 5:
_i++;
return [3 /*break*/, 3];
case 6: return [2 /*return*/];
}
});
}); });
client.on("Network.responseReceived", function (payload) { return __awaiter(_this, void 0, void 0, function () {
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, client
.send("Network.getResponseBody", {
requestId: payload.requestId,
})
.catch(function () { })];
case 1:
_a.sent();
return [2 /*return*/];
}
});
}); });
return [4 /*yield*/, client.send("Page.getResourceTree")];
case 4:
_a.sent();
return [4 /*yield*/, client.send("DOM.enable")];
case 5:
_a.sent();
return [4 /*yield*/, client.send("CSS.enable")];
case 6:
_a.sent();
return [4 /*yield*/, client.send("Console.enable")];
case 7:
_a.sent();
return [4 /*yield*/, client.send("Overlay.enable")];
case 8:
_a.sent();
return [4 /*yield*/, client.send("Network.enable")];
case 9:
_a.sent();
return [4 /*yield*/, client.send("Overlay.setShowViewportSizeOnResize", { show: true })];
case 10:
_a.sent();
return [4 /*yield*/, client.send("Page.startScreencast")];
case 11:
_a.sent();
return [2 /*return*/, {
page: new Proxy(page, generateObjectProxyHandler("Page")),
context: context,
}];
}
});
});
}
exports.default = initializeRecorder;
function getAllNodeIds(node, nodeIds) {
if (nodeIds === void 0) { nodeIds = []; }
nodeIds.push(node.nodeId);
if (node.children) {
for (var _i = 0, _a = node.children; _i < _a.length; _i++) {
var childNode = _a[_i];
getAllNodeIds(childNode, nodeIds);
}
}
return nodeIds;
}
//# sourceMappingURL=playwright-session.js.map