Bug: The script is loaded before the DOM is built

[SamIvan-ark]

Summary

The script loads before building the DOM and crushes when it tries to find the body. Initial scripts for embedding TR:

<script src="https://cdn.jsdelivr.net/gh/hexlet/hexlet-correction@main/src/widget/index.js"></script>
<script>
    handleTypoReporter({ authorizationToken: 'MzAyOmQ2ZTI5ZTBhLTRkMmUtNGFlOS05MzQ2LTY4NTFlMzUwY2ZhYQ==',
    workSpaceUrl: 'https://hexlet-correction.herokuapp.com', workSpaceId: '302'})
</script>

The problem was solved by adding an event that the DOM is ready:

<script src="https://cdn.jsdelivr.net/gh/hexlet/hexlet-correction@main/src/widget/index.js"></script>
<script>
  document.addEventListener('DOMContentLoaded', function() {
    handleTypoReporter({ authorizationToken: 'MzAyOmQ2ZTI5ZTBhLTRkMmUtNGFlOS05MzQ2LTY4NTFlMzUwY2ZhYQ==',
    workSpaceUrl: 'https://hexlet-correction.herokuapp.com', workSpaceId: '302'})
});
</script>

Reproduction steps

1. Insert the script into the head
2. Open the console
3. See the error that body === null

Expected result

The typo reporter element appears on the page

Actual result

The element is not present, there is an error in the console:

index.js:176 Uncaught TypeError: Cannot read properties of null (reading 'append')
    at generateModal (index.js:176:8)
    at handleTypoReporter (index.js:277:20)

Browsers

Chrome

OS

No response

[fey]

@Mari-Krukovskaya можете взять в работу. Тут задача не совсем фронтендовая - она скорее на стыке. Нужно проверить, что новый сниппет будет ОК работать и поменять код сниппета в шаблоне страницы. Сам шаблон страницы написан на Java, но я думаю, что сможете разобраться

[fey]

Актуально и выглядит несложно.

[amirhraj]

Взяли в работу ?

[fey]

@amirhraj берите)

[amirhraj]

взял в работу

[fey]

Задача актуальна.