Include custom attribute in rendered html

[SimonF]

Hi there,

I would like to add a custom attribute in every rendered component.
the attribute should be "data-test-id" to use the smartclient-interface with a end2end-framework.

I was successfull to add the it into the rendered html element with the drawn-callback. This was possible for every subclass of Canvas and evers formitem with this snippet

isc.Canvas.addProperties({
    drawn: function() {
        if (this.datatestid) {
            var outerElement = this.getOuterElement();
            if (outerElement) {
                outerElement.setAttribute("data-test-id", this.datatestid);
            } else {
                //console.warn("Outer element not found for", this.ID);
            }
        }
    }
});
isc.DynamicForm.addProperties({
    drawn: function() {
        this.Super("drawn", arguments);
        this.getItems().forEach(function(item) {
            var elementId = item.getDataElementId();
            const elements = document.querySelectorAll('[\\$89="''+item.getID()+''"]');
            var element = document.getElementById(elementId);
            if(!element){
                element = elements[0];
            }
            if (item.datatestid&& element) {
                element.setAttribute("data-test-id", item.datatestid);
            }
        });
    }
});

The problem is that in some cases the component gets redrawn, but the datatestid is not shown anymore. I assume that drawn is only called initially and not after a redraw.
Is there an option.

I know that this might not be supported in the default automation testing at https://smartclient.com/smartclient/...tomatedTesting , but I won't use selenium and the normal IDs will be given randomly, so I'm forced to set a static in the datatestid.

Do you have any idea/hint how I could consistently add a test-id to all components?

Best regards and thanks for any support

[Isomorphic]

You should not take this approach, as it is unsupported and unsupportable, since the DOM differs by necessity across browsers, operating systems, skins, component settings and sometimes even patch levels (due to workarounds for new browser bugs).

If you continue with your current approach, you will produce "tests" that are worse than useless. The tests will break frequently, often in large batches, and you will be struggling trying to fix them with no help from either the docs or from support, because you're trying to figure out what's going on in the intentionally undocumented DOM.

We've seen all this play out - it happens every time someone ignores our advice.

Instead of trying to directly access the DOM, simply use SCLocators and the AutoTest APIs for working with them. This is not a Selenium-specific system - we use the same thing with Cypress (which we recommend) and with other test tools.