How to access getbbox on a svg element in a cypress test-CodePudding

I have a SVG which includes text elements. I can get the text of the elements in my cypress test, but when I try to call getbbox() I get the error 'TypeError: text.getBBox is not a function'. If I understand correctly cypress is returning text as a htmlELement, and I need an SVGElement to call getbbox() on, but whats best practice to do that in the context of a cypress test?

cy.get('svg#osmdSvgPage1').get("text").each(textElement => {
    var text = textElement.text(); //successful
    //do some stuff
    var bbox = textElement.getbbox(); //throws 'TypeError: text.getBBox is not a function'
    //do more stuff
});

CodePudding user response：

WRT to getBBox(), it must be called on the native SVGGraphicsElement, but you have called it on the jQuery object passed into .each().

Just add an index like this to unwrap the jQuery object:

var bbox = textElement[0].getBBox()

WRT cy.get('svg#osmdSvgPage1').get("text") I think you want this instead

cy.get('svg#osmdSvgPage1').find("text")

assuming the text elements are within the svg.

If there's only one svg, you can just use

cy.get("text")

but if there are several svg on the page cy.get('svg#osmdSvgPage1').get("text") will return all the text from all svg, because .get("text") scans the whole page by default.