Accessing the page's custom attribute from within an extension

Question

I have a web page that adds a custom attribute to an html tag.

I need to access this attribute from within my extension (created with Google Extensions), I have the following code.

//'page.html'

<script>

    let meta = {
        input:"",
        onChange:()=>{}
    }

    const main = document.getElementsByClassName("main")[0]
    
    main.data_custom = meta

    console.log(document.getElementsByClassName("main")[0].data_custom)
    // {input, onChange}...

</script>

extension.js

function mainPage(){
    console.log(document.getElementsByClassName("main")[0].data_custom)
    // undefined
}

async function main(){
       chrome.tabs.query({ active: true, currentWindow: true }, function(tabs) {
        chrome.scripting.executeScript({
            target: {
                tabId: tabs[0].id
            },
            func: mainPage
        });
      });    
}

document.addEventListener('DOMContentLoaded', function () {
    main();
})

;

Running in fact on the page we have the attribute created with the input and onChange keys, but accessing it from within the extension, the console returns undefined.

Forgetting some extension configuration to access the document that way?