Skip to main content
cancel
Showing results for 
Search instead for 
Did you mean: 

Register now to learn Fabric in free live sessions led by the best Microsoft experts. From Apr 16 to May 9, in English and Spanish.

Reply
taghos
Employee
Employee

Automated Accessibility Testing for custom powerbi visual

Hello,

We have developed a custom powerbi visual and would like to automate the accessibility tests(or for that matter, running e2e tests). We explored selenium-webdriver and cypress to run accessibility tests(both use axe-core library internally) on a given powerbi report link that contains the custom visual, but unofrtunately they can't find any element of the visual. I am guessing maybe due to the sandboxed iframe environment. Does anyone have any experience automating the accessibility test using any tool for a custom visual?
P.S. I've tried running cypress and selenium on a Angular project, and both run perfectly fine. Also, the test for powerbi visual is able to get to the report. Hence, assuming it's not an issue with the tool or accessing the report. If I could figure out a way to access the html elements of custom visual (like a button inside the visual) using any browser automation tool, the problem should be solved!

1 REPLY 1
dm-p
Super User
Super User

Hi @taghos

I haven't personally got into these frameworks for automated testing, so I'm not sure how granular you can be with how to access elements. Typically, selecting an element from a higher-order element (i.e. main window into an embedded iframe) should work.

Although the DOM is slightly different for custom visuals in edit vs. reading mode, using a CSS selector to get to the div element by ID (sandbox-host) within the visual from the main window should still yield results if the tooling can work with the entire page.

Your mileage may vary but I've just done a quick test with the jQuery instance available in the main window, and this works as I might expect:

image.png

If there are multiple unique custom visuals in the report page DOM, then this may not be specific enough, so an ID and class selector that matches the visual guid from your pbiviz.json can also work, e.g.:

image.png

This would be in the format #sandbox-host.visual-{guid}

It looks like Selenium supports the use of CSS selectors, so this might provide an option if you haven't already tried this approach.

While researching I also found this article, which suggests there might be some special handling of iframes when using Selenium. This may apply for custom visuals also.

Good luck!

Daniel





Did I answer your question? Mark my post as a solution!

Proud to be a Super User!


My course: Introduction to Developing Power BI Visuals


On how to ask a technical question, if you really want an answer (courtesy of SQLBI)




Helpful resources

Announcements
Microsoft Fabric Learn Together

Microsoft Fabric Learn Together

Covering the world! 9:00-10:30 AM Sydney, 4:00-5:30 PM CET (Paris/Berlin), 7:00-8:30 PM Mexico City

PBI_APRIL_CAROUSEL1

Power BI Monthly Update - April 2024

Check out the April 2024 Power BI update to learn about new features.

April Fabric Community Update

Fabric Community Update - April 2024

Find out what's new and trending in the Fabric Community.

Top Kudoed Authors