Как открыть RichFaces Modal, используя javascript?

Question

У меня есть сценарий, в котором мне нужно прикрепить прослушиватель событий нажатия кнопки и обрабатывать открытие RichFacesModal только в этом прослушивателе.

В консоли браузера отображается эта ошибка

Uncaught Reference Error: Richfaces is not defined

Элемент кнопки:

let btnElement = document.getElementById("upgrade-button-top");

btnElement.addEventListener("click", function(){
    Richfaces.showModalPanel("modal-upgrade-adapter-popup");

    alert("called");
});    

X HTML:

<f:view>
    <a4j:form>

        <rich:panel header="RichFaces Greeter" style="width: 315px">

            <h:outputText value="Your name: " />
            <h:inputText value="#{user.name}" >
                <f:validateLength minimum="1" maximum="30" />
            </h:inputText>

            <a4j:commandButton value="Get greeting" reRender="greeting" />


            <h:panelGroup id="greeting" >
                <h:outputText value="Hello, " rendered="#{not empty user.name}" />

                <h:outputText value="#{user.name}" />

                <h:outputText value="!" rendered="#{not empty user.name}" />  
            </h:panelGroup>
         </rich:panel>
     </a4j:form>
</f:view>