Tests for hard reload use case

addon/index.ts

@@ -127,6 +127,8 @@ async function eventuallyTryScrollingTo(owner: ApplicationInstance, url?: string
 
   if (!hash) return;
 
+  await waitForPromise(mutationsSettled(owner));
+
   await waitForPromise(uiSettled(owner));
 
   if (isDestroyed(owner) || isDestroying(owner)) {
@@ -136,11 +138,15 @@ async function eventuallyTryScrollingTo(owner: ApplicationInstance, url?: string
   scrollToHash(hash);
 }
 
+export async function uiSettled(owner: ApplicationInstance) {
+  // TODO: make sure that backburner queues are empty
+}
+
 const TIME_SINCE_LAST_MUTATION = 500; // ms
 const MAX_TIMEOUT = 2000; // ms
 
 // exported for testing
-export async function uiSettled(owner: ApplicationInstance) {
+export async function mutationsSettled(owner: ApplicationInstance) {
   let timeStarted = new Date().getTime();
   let lastMutationAt = Infinity;
   let totalTimeWaited = 0;

tests/integration/hash-test.ts

@@ -6,11 +6,12 @@ import { hbs } from 'ember-cli-htmlbars';
 import { module, test } from 'qunit';
 import { setupApplicationTest } from 'ember-qunit';
 
-import { scrollToHash, uiSettled } from 'ember-url-hash-polyfill';
+import { mutationsSettled, scrollToHash } from 'ember-url-hash-polyfill';
 
 import { setupRouter } from './-helpers';
 
 import type RouterService from '@ember/routing/router-service';
+import { currentURL  } from '@ember/test-helpers';
 
 module('Hash', function (hooks) {
   setupApplicationTest(hooks);
@@ -38,6 +39,33 @@ module('Hash', function (hooks) {
     );
   }
 
+  module('initial page load', function (_hooks) {
+    test('waits for app to settle', async function (assert) {
+      this.owner.register(
+        'template:application',
+        hbs`
+          <h1 id="first">first!</h1>
+          <div style="height: 100vh;"></div>
+
+          <h1 id="second">second!</h1>
+          <div style="height: 100vh;"></div>
+        `
+      );
+
+      await visit('/#second');
+
+      let container = document.querySelector('#ember-testing-container');
+      let first = find('#first');
+      let second = find('#second');
+
+      debugAssert(`Expected all test elements to exist`, container && first && second);
+
+      assert.false(isVisible(first, container), 'first header is not visible');
+      assert.true(isVisible(second, container), 'second header is visible');
+      assert.equal(currentURL(), '/#second', 'initially, preserves hash');
+    });
+  });
+
   module('linking with hashes', function (_hooks) {
     test('in-page-links can be scrolled to with native anchors', async function (assert) {
       this.owner.register(
@@ -223,22 +251,22 @@ module('Hash', function (hooks) {
       debugAssert(`Expected all test elements to exist`, container);
 
       router.transitionTo('/foo');
-      await uiSettled(this.owner);
+      await mutationsSettled(this.owner);
 
       assert.true(isVisible(find('#foo-first'), container), 'first header is visible');
       assert.false(isVisible(find('#foo-second'), container), 'second header is not visible');
       assert.equal(location.hash, '', 'initially, has no hash');
 
       router.transitionTo('/bar#bar-second');
-      await uiSettled(this.owner);
+      await mutationsSettled(this.owner);
       await scrollSettled();
 
       assert.false(isVisible(find('#bar-first'), container), 'first header is not visible');
       assert.true(isVisible(find('#bar-second'), container), 'second header is visible');
       assert.equal(location.hash, '#bar-second', 'clicked hash appears in URL');
 
       router.transitionTo('/foo#foo-second');
-      await uiSettled(this.owner);
+      await mutationsSettled(this.owner);
       await scrollSettled();
 
       assert.false(isVisible(find('#foo-first'), container), 'first header is not visible');