Hey everyone, I've been trying to automate a specific task on my Servicenow dev instance, but I'm unable to successfully navigate to a specific input field and type into it. Here's what I've tried so far: 1. Using shadow DOM traversal: I've attempted to navigate through the shadow DOM by using the

.shadow()

method, but it hasn't been successful. I've followed the recommended approach of traversing through parent elements, but I keep encountering errors such as timeouts and undefined properties. Despite stepping through all the parent elements leading down to the target input field, I'm still unable to locate it and interact with it. I've spent a considerable amount of time troubleshooting and exploring different options, but I seem to be hitting a roadblock. I'm wondering if there might be alternative approaches or techniques that I haven't considered. The element I'm trying to locate, you can see from the screen sot, is an input field: I am walking down the DOM and this is as far as I can get before it suddenly can't find any other element:

cy.get('macroponent-f51912f4c700201072b211d4d8c26010')
        .should('not.be.visible')
        .shadow()
        .find('div')
        .should('not.be.visible')
        .find('sn-polaris-layout')
        .should('not.be.visible')
        .shadow()
        .should('not.be.visible')
        .find('div.sn-polaris-layout.polaris-enabled')
        .find('sn-polaris-header')
        .shadow()
        .should('not.be.visible')
        .find('nav.polaris-layout')
        .find('div.polaris-header.can-animate.polaris-enabled')
        .find('sn-polaris-menu.can-animate[aria-label="Unpinned Workspaces menu"]')
        .shadow()
        .should('not.be.visible');

I have also tried:

cy.get('macroponent-f51912f4c700201072b211d4d8c26010')
  .shadow()
  .find('sn-polaris-menu.can-animate[aria-label="Unpinned Workspaces menu"]')
  .invoke('attr', 'class', 'can-animate is-main-menu is-open');

cy.get('sn-polaris-nav.63242b61c3133010cbd77096e940dd23')
  .invoke('attr', 'aria-expanded', 'true');

I even tried manually using keyboard commands, although there's unfortunately no tab command. 😭 I highly suspect the issue is the menu that needs to be open and visible, is actually located in a different area of the DOM than the filter itself. So, traversing down to the menu and expanding / clicking / focsing / anything, does not allow me to find any other element not directly in that area? But, if I try to just navigate directly to the filter itself, about 75% of the way there, something with the menu's makes it so I can't actually find anything anymore: In the second screen shot you can see where it stops beyond that .shadow() I can't figure out ANY way to target the child or any other element in that root... If anyone has experience with or has encountered similar challenges, I would greatly appreciate your guidance and suggestions. It would be incredibly helpful if you could share any insights, alternative approaches, or potential solutions that could help me successfully interact with this input field. Thank you in advance for your assistance!