Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Request: Option to work in head tag or body #22

Open
jafin opened this issue Sep 2, 2022 · 0 comments
Open

Request: Option to work in head tag or body #22

jafin opened this issue Sep 2, 2022 · 0 comments

Comments

@jafin
Copy link
Contributor

jafin commented Sep 2, 2022

Running script from head tag vs body

For apps that load the react-abode script in the head instead of bottom of body, would it be possible to amend to check for DOMContentLoaded event?

Something like the below perhaps:

export const populate = async (options?: PopulateOptions) => {
  if (/complete|interactive|loaded/.test(document.readyState)) {
    addNewComponentHandler(options);
  }
  else {
    document.addEventListener('DOMContentLoaded', ()=> addNewComponentHandler(options), false);
  }
};

const addNewComponentHandler = async (options?: PopulateOptions) => {
  await checkForAndHandleNewComponents(options);

  document.body.addEventListener('DOMNodeInserted', () =>
    checkForAndHandleNewComponents(options))
};

If I attempt to configure the script in head now, I receive the error:

Uncaught (in promise) TypeError: Cannot read properties of null (reading 'addEventListener')
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant