Check ready state of document in public pages (#3652)

* Check ready state of document in public pages

* add check interactive

app/javascript/packs/public.js

@@ -10,7 +10,7 @@ require.context('../images/', true);
 const { localeData } = getLocale();
 localeData.forEach(IntlRelativeFormat.__addLocaleData);
 
-function main() {
+function loaded() {
   const locale = document.documentElement.lang;
   const dateTimeFormat = new Intl.DateTimeFormat(locale, {
     year: 'numeric',
@@ -21,7 +21,6 @@ function main() {
   });
   const relativeFormat = new IntlRelativeFormat(locale);
 
-  document.addEventListener('DOMContentLoaded', () => {
   [].forEach.call(document.querySelectorAll('.emojify'), (content) => {
     content.innerHTML = emojify(content.innerHTML);
   });
@@ -37,7 +36,14 @@ function main() {
     const datetime = new Date(content.getAttribute('datetime'));
     content.textContent = relativeFormat.format(datetime);;
   });
-  });
+}
+
+function main() {
+  if (['interactive', 'complete'].includes(document.readyState)) {
+    loaded();
+  } else {
+    document.addEventListener('DOMContentLoaded', loaded);
+  }
 
   delegate(document, '.video-player video', 'click', ({ target }) => {
     if (target.paused) {