Выбрать / выделить / пометить частичный текст в p-Tag с помощью WebDriver - PullRequest
Новая
       14

Выбрать / выделить / пометить частичный текст в p-Tag с помощью WebDriver

0 голосов
/ 01 июля 2019

У меня есть эта разметка: 

<body>
  <p>
    Test 1<br/>
    Test 2
  </p>
</body>

Теперь я хочу выбрать «Тест 1», чтобы иметь возможность применять определенные стили с редактором WYSIWIG. Есть ли возможность выделить эту часть текста? Если нет: как бы я выделил текст <p></p>?

Ответы [ 2 ]

0 голосов
/ 01 июля 2019

Вот решение js-сценария, которое выделит текстовый узел жирным шрифтом.

Сначала позвольте мне показать, как это сделать в js (для понимания здесь используется консоль chrome devtools).Затем мы можем перенести это на селен 

// get the text node that you want to bold
var textNode = $x('//p/text()[1]')[0];
// create a bold element
var boldEle = document.createElement('b');
// copy the text from text node to boldEle
boldEle.innerText = textNode.nodeValue;
// place the boldEle before the current text which you want to bold
textNode.parentElement.insertBefore(boldEle,textNode.parentElement.childNodes[0]);
// remove the original textNode
textNode.remove();

Снимок экрана: хромированная консоль.enter image description here

Теперь преобразуйте это в функцию и работайте с селеном.

Python: 

jsFunction = """window.boldTextNode =function(parentXpath,textPosition){
                // get the text node that you want to bold
                var parent = arguments[0];
                var textPosition = arguments[1];
                var txtPosition = 0;
                var child = parent.firstChild;debugger;
                while(child) {
                  if (child.nodeType === 3){                        
                    if (txtPosition===(textPosition-1)){
                      var textNode = child;                
                      break;
                    }}else{txtPosition+=1;}
                  child = child.nextSibling;
                }
                // create a bold element
                var boldEle = document.createElement('b');
                // copy the text from text node to boldEle
                boldEle.innerText = textNode.nodeValue;
                // place the boldEle before the current text which you want to bold
                textNode.parentElement.insertBefore(boldEle,textNode.parentElement.childNodes[0]);
                // remove the original textNode
                textNode.remove();}
            """
# load the function so that you can call where ever you want
driver.execute_script(jsFunction)

# get the parent element
ele = driver.find_element_by_xpath("//p")
# now bold the text using the js function
driver.execute_script("boldTextNode(arguments[0],arguments[1]);",ele,1)
0 голосов
/ 01 июля 2019

Стилизация должна применяться к элементу, а не к текстовому узлу. Имея это в виду, вы не сможете легко применить изменения только к тексту Test 1.

Чтобы упростить задачу, вы можете попросить разработчика обернуть несколько <span> тегов вокруг текста, который вы хотите выделить, тогда это сделает изменение уровня элемента.

Я уверен, что есть какой-то ужасный взлом JavaScript, чтобы превратить текст в элемент и стилизовать его, но я бы действительно посоветовал вам не идти по этому пути.

...