Asking because it seems we have an issue there. MDN doesn't really answer this question: https://developer.mozilla.org/en-US/docs/Web/API/Document/readyState#values
It depends on how your JavaScript is loaded.
If your script is a module or is inline or has defer, the script will be executed after the document has been parsed. In this case readyState will be interactive in the constructor and connectedCallback of your custom element.
defer
This Boolean attribute is set to indicate to a browser that the script is meant to be executed after the document has been parsed, but before firing DOMContentLoaded.
Scripts with the defer attribute will prevent the DOMContentLoaded event from firing until the script has loaded and finished evaluating.
Otherwise, the script will be executed immediately before the document has been parsed. In this case readyState will be loading in both the constructor and connectedCallback of your custom element.
Scripts without async , defer or type="module" attributes, as well as inline scripts, are fetched and executed immediately, before the browser continues to parse the page.