How can I scroll to the bottom of the chat when opening it in Dialogflow Messenger CX using TypeScript?

Question

I'm doing this code, but I don't think that it's a good pratctice.

const dfMessenger = document.querySelector("df-messenger");

    dfMessenger?.addEventListener("df-messenger-loaded", () => {
      const botao = dfMessenger.shadowRoot?.querySelector("#widgetIcon");
      botao?.addEventListener("click", () => {
        const dfMessengerList = dfMessenger.shadowRoot
          ?.querySelector("#df-chat-wrapper")
          ?.shadowRoot?.querySelector("df-message-list");
        if (dfMessengerList) {
          const messagesList=
            dfMessengerList.shadowRoot?.querySelector("#messageList");
          if (messagesList) messagesList.scrollTop = messagesList.scrollHeight;
        }
      });
    });

Any suggestions?