Issue
There is a button in the header of Microsoft Support pages that initially displays as “Buy Microsoft 365”, but changes to “Try Copilot Chat” shortly after the page loads.
I want to block this change with a uBlock Origin filter.
Troubleshooting
Looking at the developer tools, the class, attributes, and text content of the element are being changed post-load.
Before
<li class="single-link js-nav-menu" id="c-uhf-nav-cta" style="overflow-x: visible;">
<a id="buyInstallButton" class="c-uhf-nav-link" href="https://go.microsoft.com/fwlink/?linkid=849747" data-m="{"cN":"CatNav_cta_Buy Microsoft 365_nav","id":"n13c8c2m1r1a1","sN":13,"aN":"c8c2m1r1a1"}" style="overflow-x: visible;">Buy Microsoft 365</a>
</li>
After
<li class="single-link js-nav-menu" id="c-uhf-nav-cta" style="overflow-x: visible;">
<a id="buyInstallButton" class="sc-TBWPX jvfpSe c-uhf-nav-link" href="https://m365.cloud.microsoft/chat?fromcode=cmmd71pygu7" data-m="{"cN":"CatNav_cta_Buy Microsoft 365_nav","id":"n13c8c2m1r1a1","sN":13,"aN":"c8c2m1r1a1"}" data-bi-slot="1">Try Copilot Chat</a>
</li>
After adding a breakpoint for attribute changes on the button, I found that it was being modified by the script https://support.microsoft.com/lib/uhf/dist/uhfbundle.js?v=of4Bk4iHW2lu2zc7UaUcCo47rVLNSJYX0ELAcivbHkg. Blocking the script stops the button from changing, but it also breaks other parts of the page like the “Sign in” button.
||support.microsoft.com/lib/uhf/dist/uhfbundle.js?v=of4Bk4iHW2lu2zc7UaUcCo47rVLNSJYX0ELAcivbHkg$script,domain=support.microsoft.com
I can hide the button post-modification by filtering on the new class that gets added. However, this has the effect of the “Buy Microsoft 365” button appearing then disappearing after a second. I’d rather the button stay on the page without changing.
support.microsoft.com###buyInstallButton.sc-TBWPX.jvfpSe.c-uhf-nav-link
Question
Is it possible to prevent the “Buy Microsoft 365” button from transforming into a “Try Copilot Chat” button with a filter in uBlock Origin?
