code from function-sample-tutorial.quick-api-reference encounters authentication issue with API: Error Code 401

[ahauser16]

code from function-sample-tutorial.quick-api-reference encounters authentication issue with API: Error Code 401

[patrickkettner]

Hi @ahauser16!
This is because the documentation website was recently migrated to a new backend system, so the specific selector being used is no longer valid.
As a temporary workaround, you can change the selector on line 4 from .navigation-rail__links to .devsite-tabs-wrapper to see something similar.

[itzmeimran]

Is this issue stil open ???

[4Furki4]

quering the dom for the nav as below solved the issue for me. I can see the Tip text on the navbar that opens the popup.

const nav = document.querySelector('.lower-tabs .devsite-tabs-wrapper');
OR
const nav = document.querySelector('.upper-tabs .devsite-tabs-wrapper');

However, I still see the error Uncaught (in promise) TypeError: Cannot read properties of null (reading 'append') that points to the line nav.append(tipWidget);

[parth-r-parmar]

Style issue :
Add double quote in style attribute of button.

before

  const tipWidget = createDomElement(`
    <button class="navigation-rail__link" popovertarget="tip-popover" popovertargetaction="show" style="padding: 0; border: none; background: none;>
      <div class="navigation-rail__icon">
        <svg class="icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="24" height="24" viewBox="0 0 24 24" fill="none"> 
        <path d='M15 16H9M14.5 9C14.5 7.61929 13.3807 6.5 12 6.5M6 9C6 11.2208 7.2066 13.1599 9 14.1973V18.5C9 19.8807 10.1193 21 11.5 21H12.5C13.8807 21 15 19.8807 15 18.5V14.1973C16.7934 13.1599 18 11.2208 18 9C18 5.68629 15.3137 3 12 3C8.68629 3 6 5.68629 6 9Z'"></path>
        </svg>
      </div>
      <span>Tip</span> 
    </button>
  `);

after

  const tipWidget = createDomElement(`
    <button class="navigation-rail__link" popovertarget="tip-popover" popovertargetaction="show" style="padding: 0; border: none; background: none;">
      <div class="navigation-rail__icon">
        <svg class="icon" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" width="24" height="24" viewBox="0 0 24 24" fill="none"> 
        <path d='M15 16H9M14.5 9C14.5 7.61929 13.3807 6.5 12 6.5M6 9C6 11.2208 7.2066 13.1599 9 14.1973V18.5C9 19.8807 10.1193 21 11.5 21H12.5C13.8807 21 15 19.8807 15 18.5V14.1973C16.7934 13.1599 18 11.2208 18 9C18 5.68629 15.3137 3 12 3C8.68629 3 6 5.68629 6 9Z'"></path>
        </svg>
      </div>
      <span>Tip</span> 
    </button>
  `);

[oliverdunk]

Closing this as a duplicate of #1084 since I just left a more detailed reply there, but thanks all for the feedback.