Bug 1722462 - [devtools] Wait for dom-complete in waitForViewportLoad. r=ochameau (6cd53a10) · Commits · clairehurst / Tor Browser

devtools/client/responsive/test/browser/browser_device_change.js

+8 −8

Original line number	Diff line number	Diff line
		@@ -39,9 +39,9 @@ addRDMTask(
		testViewportDeviceMenuLabel(ui, "Responsive");

		// Test device with custom properties
		let reloaded = waitForViewportLoad(ui);
		let { onPageLoaded } = await waitForViewportLoad(ui);
		await selectDevice(ui, "Fake Phone RDM Test");
		await reloaded;
		await onPageLoaded;
		await waitForViewportResizeTo(ui, testDevice.width, testDevice.height);
		info("Should have device UA now that device is applied");
		await testUserAgent(ui, testDevice.userAgent);
		@@ -50,7 +50,7 @@ addRDMTask(

		// Test resetting device when resizing viewport
		const deviceRemoved = once(ui, "device-association-removed");
		reloaded = waitForViewportLoad(ui);
		({ onPageLoaded } = await waitForViewportLoad(ui));

		await testViewportResize(
		ui,
		@@ -59,7 +59,7 @@ addRDMTask(
		[0, -10]
		);

		await Promise.all([deviceRemoved, reloaded]);
		await Promise.all([deviceRemoved, onPageLoaded]);
		info("Should have default UA after resizing viewport");
		await testUserAgent(ui, DEFAULT_UA);
		await testDevicePixelRatio(ui, DEFAULT_DPPX);
		@@ -99,17 +99,17 @@ addRDMTask(
		);

		// Select device with custom UA
		let reloaded = waitForViewportLoad(ui);
		let { onPageLoaded } = await waitForViewportLoad(ui);
		await selectDevice(ui, "Fake Phone RDM Test");
		await reloaded;
		await onPageLoaded;
		await waitForViewportResizeTo(ui, testDevice.width, testDevice.height);
		info("Should have device UA now that device is applied");
		await testUserAgent(ui, testDevice.userAgent);

		// Browser will reload to clear the UA on RDM close
		reloaded = waitForViewportLoad(ui);
		({ onPageLoaded } = await waitForViewportLoad(ui));
		await closeRDM(tab);
		await reloaded;
		await onPageLoaded;

		// Ensure UA is reset to default after closing RDM
		info("Should have default UA after closing RDM");

devtools/client/responsive/test/browser/browser_device_state_restore.js

+4 −4

Original line number	Diff line number	Diff line
		@@ -48,9 +48,9 @@ addRDMTask(
		await testTouchEventsOverride(ui, false);

		info("Select a device");
		const reloaded = waitForViewportLoad(ui);
		const { onPageLoaded } = await waitForViewportLoad(ui);
		await selectDevice(ui, TEST_DEVICE.name);
		await reloaded;
		await onPageLoaded;
		await waitForViewportResizeTo(ui, TEST_DEVICE.width, TEST_DEVICE.height);

		info("Checking the RDM device state.");
		@@ -84,7 +84,7 @@ addRDMTask(
		state.devices.listState == Types.loadableState.LOADED
		);
		await waitForViewportResizeTo(ui, TEST_DEVICE.width, TEST_DEVICE.height);
		await waitForViewportLoad(ui);
		await (await waitForViewportLoad(ui)).onPageLoaded;

		info("Checking the restored RDM state.");
		testViewportDeviceMenuLabel(ui, TEST_DEVICE.name);
		@@ -121,7 +121,7 @@ addRDMTask(
		state.devices.listState == Types.loadableState.LOADED
		);
		await waitForViewportResizeTo(ui, TEST_DEVICE.height, TEST_DEVICE.width);
		await waitForViewportLoad(ui);
		await (await waitForViewportLoad(ui)).onPageLoaded;

		info("Checking the restored RDM state.");
		testViewportDeviceMenuLabel(ui, TEST_DEVICE.name);

devtools/client/responsive/test/browser/browser_max_touchpoints.js

+10 −30

Original line number	Diff line number	Diff line
		@@ -38,9 +38,15 @@ addRDMTask(TEST_COM_URL, async function({ ui, browser, tab }) {
		"navigator.maxTouchPoints should be 0 after turning off touch simulation"
		);

		info("Check maxTouchPoints override persists after reload");
		info("Enabling touch simulation again");
		await toggleTouchSimulation(ui);
		is(
		await getMaxTouchPoints(browser),
		1,
		"navigator.maxTouchPoints should be 1 after enabling touch simulation again"
		);

		info("Check maxTouchPoints override persists after reload");
		await reloadViewport(ui);

		is(
		@@ -53,39 +59,13 @@ addRDMTask(TEST_COM_URL, async function({ ui, browser, tab }) {
		"Check that maxTouchPoints persist after navigating to a page that forces the creation of a new browsing context"
		);
		const previousBrowsingContextId = browser.browsingContext.id;
		let onPageReloaded = BrowserTestUtils.browserLoaded(
		browser,
		true,
		loadedUrl => loadedUrl.includes(URL_ROOT_ORG_SSL)
		);

		// `closeRDM`, which is used later, check that the responsiveFront isn't destroyed
		// to reset the state of the document. It might happen that the rest of the test
		// happens so fast that the RDM ui doesn't have the time to update its responsiveFront
		// instance (it's done onTargetAvailable), and so the one it will check is the "old" one,
		// which is likely to be destroyed, causing the destroy method to not be fully executed
		// as expected. In order to prevent such thing, we do wait until a new instance is
		// put on the ui.
		let targets = 0;
		const expectedTargets = isFissionEnabled() ? 2 : 1;
		const onAvailableTargetProcessed = new Promise(resolve => {
		const off = ui.commands.targetCommand.on(
		"processed-available-target",
		() => {
		targets++;
		if (targets == expectedTargets) {
		resolve();
		off();
		}
		}
		);
		});

		const { onPageLoaded } = await waitForViewportLoad(ui);
		BrowserTestUtils.loadURI(
		browser,
		URL_ROOT_ORG_SSL + TEST_DOCUMENT + "?crossOriginIsolated=true"
		);
		await Promise.all([onPageReloaded, onAvailableTargetProcessed]);
		await onPageLoaded;

		isnot(
		browser.browsingContext.id,
		@@ -101,7 +81,7 @@ addRDMTask(TEST_COM_URL, async function({ ui, browser, tab }) {

		info("Check that the value is reset when closing RDM");
		// Closing RDM trigers a reload
		onPageReloaded = BrowserTestUtils.browserLoaded(browser, true);
		const onPageReloaded = BrowserTestUtils.browserLoaded(browser, true);
		await closeRDM(tab);
		await onPageReloaded;

devtools/client/responsive/test/browser/browser_orientationchange_event.js

+2 −3

Original line number	Diff line number	Diff line
		@@ -96,13 +96,12 @@ addRDMTask(TEST_COM_URL, async function({ ui }) {
		);
		const browser = ui.getViewportBrowser();
		const previousBrowsingContextId = browser.browsingContext.id;
		const onPageReloaded = BrowserTestUtils.browserLoaded(browser, true);
		const onViewportLoad = waitForViewportLoad(ui);
		const { onPageLoaded } = await waitForViewportLoad(ui);
		BrowserTestUtils.loadURI(
		browser,
		URL_ROOT_ORG_SSL + TEST_DOCUMENT + "?crossOriginIsolated=true"
		);
		await Promise.all([onPageReloaded, onViewportLoad]);
		await onPageLoaded;

		isnot(
		browser.browsingContext.id,

devtools/client/responsive/test/browser/head.js

+20 −19

Original line number	Diff line number	Diff line
		@@ -578,12 +578,24 @@ async function waitForPageShow(browser) {
		return waitForTick();
		}

		function waitForViewportLoad(ui) {
		return BrowserTestUtils.waitForContentEvent(
		/**
		* Returns a Promise which resolves with an object holding a `onPageLoaded` property, which
		* is a promise that resolves when the page is fully loaded.
		*
		* @param {ResponsiveUI} ui
		* @returns Promise<{ onPageLoaded: Promise }>
		*/
		async function waitForViewportLoad(ui) {
		const onLoad = BrowserTestUtils.waitForContentEvent(
		ui.getViewportBrowser(),
		"load",
		true
		);
		const {
		onDomCompleteResource,
		} = await waitForNextTopLevelDomCompleteResource(ui.commands);

		return { onPageLoaded: Promise.all([onLoad, onDomCompleteResource]) };
		}

		function waitForViewportScroll(ui) {
		@@ -604,20 +616,9 @@ async function load(browser, url) {
		* Reload and wait for the viewport to be loaded and for the page to be fully parsed.
		*/
		async function reloadViewport(ui) {
		const onReload = waitForViewportLoad(ui);
		const {
		onResource: onDomComplete,
		} = await ui.commands.resourceCommand.waitForNextResource(
		ui.commands.resourceCommand.TYPES.DOCUMENT_EVENT,
		{
		ignoreExistingResources: true,
		predicate: resource =>
		resource.targetFront.isTopLevel && resource.name === "dom-complete",
		}
		);
		const { onPageLoaded } = await waitForViewportLoad(ui);
		ui.getViewportBrowser().reload();
		await onDomComplete;
		await onReload;
		await onPageLoaded;
		}

		function back(browser) {
		@@ -688,9 +689,9 @@ async function toggleTouchSimulation(ui) {
		const { document } = ui.toolWindow;
		const touchButton = document.getElementById("touch-simulation-button");
		const changed = once(ui, "touch-simulation-changed");
		const loaded = waitForViewportLoad(ui);
		const { onPageLoaded } = await waitForViewportLoad(ui);
		touchButton.click();
		await Promise.all([changed, loaded]);
		await Promise.all([changed, onPageLoaded]);
		}

		async function testUserAgent(ui, expected) {
		@@ -743,9 +744,9 @@ async function changeUserAgentInput(ui, value) {
		state => state.ui.userAgent === value
		);
		const changed = once(ui, "user-agent-changed");
		const loaded = waitForViewportLoad(ui);
		const { onPageLoaded } = await waitForViewportLoad(ui);
		Simulate.keyUp(userAgentInput, { keyCode: KeyCodes.DOM_VK_RETURN });
		await Promise.all([changed, loaded, userAgentChanged]);
		await Promise.all([changed, onPageLoaded, userAgentChanged]);
		}

		/**