Newbie here, trying to match text that happens to be in an SVG element, but my initial problem is that Selector API has withText, that seems to match innerText of a DOM node, but not a function that accesses innerHTML. My <text>
node has no innerText (it returns undefined
despite there being text in the node).
With this HTML:
..document begins..
<svg><g><text>Text here</text></g></svg>
..document continues..
This assertion fails, because the node has no innerText: Selector('svg text').withText('Text here').exists
I can query for the node and print its innerHTML, so the value is there in the DOM:
console.log(document.querySelectorAll('svg text')[0].innerHTML);
Reading through http://devexpress.github.io/testcafe/documentation/test-api/selecting-page-elements/selectors.html and http://devexpress.github.io/testcafe/documentation/test-api/obtaining-data-from-the-client.html I can see whenever innerHTML is accessed in the documentation, it is done in a ClientFunction. Why is this? Why not a innerHTML accessor on the Selector API?
Do I really have to use a ClientFunction to achieve the equivalent of the invalid code: Selector('svg text').withHTML('Text here').exists
? I haven't used one before, and the learning curve seems unnecesary when withText
can access innerText so easily.
I must be missing something basic and can't find a reference in the forum, so thought this would be helpful to others too
To demonstrate, here's a little HTML document, the console log output is:
query gave: NodeList [text]
svg-text-test.html:16 innerText: undefined
svg-text-test.html:17 innerHTML: Text here
svg-text-test.html:18 textContent: Text here
File svg-text-test.html:
<!DOCTYPE html>
<html>
<head>
<title>TODO supply a title</title>
</head>
<body>
<svg><text>Text here</text></svg>
<script>
var tAr = document.querySelectorAll('svg text');
console.log('query gave: ', tAr);
var t = tAr[0];
console.log('innerText: ' + t.innerText);
console.log('innerHTML: ' + t.innerHTML);
console.log('textContent: ' + t.textContent);
</script>
</body>
</html>