How to use replaceDelimitedText method in Playwright Internal

Best JavaScript code snippet using playwright-internal

Run Playwright Internal automation tests on LambdaTest cloud grid

Perform automation testing on 3000+ real desktop and mobile devices online.

DOMChildrenOperations.js

Source: DOMChildrenOperations.js Github

copy
1/**
2 * Copyright 2013-present, Facebook, Inc.
3 * All rights reserved.
4 *
5 * This source code is licensed under the BSD-style license found in the
6 * LICENSE file in the root directory of this source tree. An additional grant
7 * of patent rights can be found in the PATENTS file in the same directory.
8 *
9 * @providesModule DOMChildrenOperations
10 */
11
12'use strict';
13
14var DOMLazyTree = require('DOMLazyTree');
15var Danger = require('Danger');
16var ReactMultiChildUpdateTypes = require('ReactMultiChildUpdateTypes');
17var ReactPerf = require('ReactPerf');
18
19var createMicrosoftUnsafeLocalFunction = require('createMicrosoftUnsafeLocalFunction');
20var setInnerHTML = require('setInnerHTML');
21var setTextContent = require('setTextContent');
22
23function getNodeAfter(parentNode, node) {
24  // Special case for text components, which return [open, close] comments
25  // from getNativeNode.
26  if (Array.isArray(node)) {
27    node = node[1];
28  }
29  return node ? node.nextSibling : parentNode.firstChild;
30}
31
32/**
33 * Inserts `childNode` as a child of `parentNode` at the `index`.
34 *
35 * @param {DOMElement} parentNode Parent node in which to insert.
36 * @param {DOMElement} childNode Child node to insert.
37 * @param {number} index Index at which to insert the child.
38 * @internal
39 */
40var insertChildAt = createMicrosoftUnsafeLocalFunction(
41  function(parentNode, childNode, referenceNode) {
42    // We rely exclusively on `insertBefore(node, null)` instead of also using
43    // `appendChild(node)`. (Using `undefined` is not allowed by all browsers so
44    // we are careful to use `null`.)
45    parentNode.insertBefore(childNode, referenceNode);
46  }
47);
48
49function insertLazyTreeChildAt(parentNode, childTree, referenceNode) {
50  DOMLazyTree.insertTreeBefore(parentNode, childTree, referenceNode);
51}
52
53function moveChild(parentNode, childNode, referenceNode) {
54  if (Array.isArray(childNode)) {
55    moveDelimitedText(parentNode, childNode[0], childNode[1], referenceNode);
56  } else {
57    insertChildAt(parentNode, childNode, referenceNode);
58  }
59}
60
61function removeChild(parentNode, childNode) {
62  if (Array.isArray(childNode)) {
63    var closingComment = childNode[1];
64    childNode = childNode[0];
65    removeDelimitedText(parentNode, childNode, closingComment);
66    parentNode.removeChild(closingComment);
67  }
68  parentNode.removeChild(childNode);
69}
70
71function moveDelimitedText(
72  parentNode,
73  openingComment,
74  closingComment,
75  referenceNode
76) {
77  var node = openingComment;
78  while (true) {
79    var nextNode = node.nextSibling;
80    insertChildAt(parentNode, node, referenceNode);
81    if (node === closingComment) {
82      break;
83    }
84    node = nextNode;
85  }
86}
87
88function removeDelimitedText(parentNode, startNode, closingComment) {
89  while (true) {
90    var node = startNode.nextSibling;
91    if (node === closingComment) {
92      // The closing comment is removed by ReactMultiChild.
93      break;
94    } else {
95      parentNode.removeChild(node);
96    }
97  }
98}
99
100function replaceDelimitedText(openingComment, closingComment, stringText) {
101  var parentNode = openingComment.parentNode;
102  var nodeAfterComment = openingComment.nextSibling;
103  if (nodeAfterComment === closingComment) {
104    // There are no text nodes between the opening and closing comments; insert
105    // a new one if stringText isn't empty.
106    if (stringText) {
107      insertChildAt(
108        parentNode,
109        document.createTextNode(stringText),
110        nodeAfterComment
111      );
112    }
113  } else {
114    if (stringText) {
115      // Set the text content of the first node after the opening comment, and
116      // remove all following nodes up until the closing comment.
117      setTextContent(nodeAfterComment, stringText);
118      removeDelimitedText(parentNode, nodeAfterComment, closingComment);
119    } else {
120      removeDelimitedText(parentNode, openingComment, closingComment);
121    }
122  }
123}
124
125/**
126 * Operations for updating with DOM children.
127 */
128var DOMChildrenOperations = {
129
130  dangerouslyReplaceNodeWithMarkup: Danger.dangerouslyReplaceNodeWithMarkup,
131
132  replaceDelimitedText: replaceDelimitedText,
133
134  /**
135   * Updates a component's children by processing a series of updates. The
136   * update configurations are each expected to have a `parentNode` property.
137   *
138   * @param {array<object>} updates List of update configurations.
139   * @internal
140   */
141  processUpdates: function(parentNode, updates) {
142    for (var k = 0; k < updates.length; k++) {
143      var update = updates[k];
144      switch (update.type) {
145        case ReactMultiChildUpdateTypes.INSERT_MARKUP:
146          insertLazyTreeChildAt(
147            parentNode,
148            update.content,
149            getNodeAfter(parentNode, update.afterNode)
150          );
151          break;
152        case ReactMultiChildUpdateTypes.MOVE_EXISTING:
153          moveChild(
154            parentNode,
155            update.fromNode,
156            getNodeAfter(parentNode, update.afterNode)
157          );
158          break;
159        case ReactMultiChildUpdateTypes.SET_MARKUP:
160          setInnerHTML(
161            parentNode,
162            update.content
163          );
164          break;
165        case ReactMultiChildUpdateTypes.TEXT_CONTENT:
166          setTextContent(
167            parentNode,
168            update.content
169          );
170          break;
171        case ReactMultiChildUpdateTypes.REMOVE_NODE:
172          removeChild(parentNode, update.fromNode);
173          break;
174      }
175    }
176  },
177
178};
179
180ReactPerf.measureMethods(DOMChildrenOperations, 'DOMChildrenOperations', {
181  replaceDelimitedText: 'replaceDelimitedText',
182});
183
184module.exports = DOMChildrenOperations;
185
Full Screen

Accelerate Your Automation Test Cycles With LambdaTest

Leverage LambdaTest’s cloud-based platform to execute your automation tests in parallel and trim down your test execution time significantly. Your first 100 automation testing minutes are on us.

Try LambdaTest

Run JavaScript Tests on LambdaTest Cloud Grid

Execute automation tests with Playwright Internal on a cloud-based Grid of 3000+ real browsers and operating systems for both web and mobile applications.

Test now for Free
LambdaTestX

We use cookies to give you the best experience. Cookies help to provide a more personalized experience and relevant advertising for you, and web analytics for us. Learn More in our Cookies policy, Privacy & Terms of service

Allow Cookie
Sarah

I hope you find the best code examples for your project.

If you want to accelerate automated browser testing, try LambdaTest. Your first 100 automation testing minutes are FREE.

Sarah Elson (Product & Growth Lead)