Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Testcafe get text from element

I'm trying to get a text from a modal on Chrome. Using the console, I can get the inner text as follows:

document.querySelector('.my-form > a').innerText
// returns http://a-url.com

Now, on my test, I can evaluate the element using

const myText = Selector('.my-form > a').innerText;
await t
  .expect(myText).contains('url');

and I can even click on that URL

await t.click(myText);

but I cannot put that inner text to a variable, for instance. I tried using a ClientFunction from this post

const getUrl = ClientFunction(() => document.querySelector('.my-form > a').innerText);

test('My Test', async t => {
const text = await getUrl();
console.log(text);
});

// this results in 
// TypeError: Cannot read property 'innerText' of null

and tried using a plain Selector as this post suggests

const text = Selector('.my-form > a').innerText;
const inner = await text.textContent;
console.log(inner);

// prints: undefined

How to extract a text from an element? I understand that t.selectText is limited in this scenario, right?

like image 602
thenewjames Avatar asked Mar 21 '19 15:03

thenewjames


People also ask

How does testcafe handle text that is already in the input?

If this parameter is omitted, TestCafe moves the cursor to the end of the text before typing. This preserves the text that is already in the input box. The t.typeText action clicks the specified element before text is typed if this element is not focused. If the target element is not focused after the click, t.typeText does not type text.

How to Test selector in testcafe?

Begin with an empty test. import { Selector } from 'testcafe' ; fixture `Test select element` .page `http://localhost:8080` ; test ( `Select an option from the drop-down menu`, async t => { // Here you will put test code. }); First, you need a selector that picks the <select> element.

How does testcafe work with MDN elements?

If this does not happen within the selector timeout , TestCafe performs the action with the element on top of the original target. Learn more about stacking and z-index  on MDN. The upload action is an exception to this rule — it does not check the visibility of the target input. Indicates which modifier keys should be pressed while typing.

What is the use of {} object in testcafe API?

) } object from TestCafe API is available. used to show in logs. Pauses execution for a number of seconds. number of second to wait. Waits for element to be present on page (by default waits for 1sec). Element can be located by CSS or XPath. ) element located by CSS|XPath|strict locator.


1 Answers

From the documentation you want:

const text = await Selector('.my-form > a').innerText;

like image 73
ioseph Avatar answered Oct 22 '22 15:10

ioseph