Mixed ProForm and Bricks' native form

I am enhancing an existing site. This site has a basic inquiry form (using the bricks native form) at the page footer. It has Name, Email, Message (textarea), and a Submit button.

When I created another Bricksforge’s ProForm in a new page, there is a JS error:-

bricksforge_elements.js?ver=1760046250:1 Uncaught (in promise) TypeError: Cannot read properties of null (reading ‘querySelector’)
at bricksforge_elements.js?ver=1760046250:1:63813
at NodeList.forEach ()
at BrfProForms.handleTextareaMaxLength (bricksforge_elements.js?ver=1760046250:1:63755)
at bricksforge_elements.js?ver=1760046250:1:63093

The code that creates this error:-
handleTextareaMaxLength() {
document.querySelectorAll(“textarea[maxlength]”).forEach((e => {
const t = e.closest(“.pro-forms-builder-field”).querySelector(“.max-length-counter”);

The querySelectorAll returns the textarea in the footer that doesn’t have .max-length-counter properties.

Right now, I have disabled the footer on this page. That resolves the problem. When this new page goes into production, I have to enable the footer again. Pls see if you could fix the problem.

Thanks
Terrence