diff options
Diffstat (limited to 'devtools/client/netmonitor/test/browser_net_new_request_panel_context_menu.js')
-rw-r--r-- | devtools/client/netmonitor/test/browser_net_new_request_panel_context_menu.js | 210 |
1 files changed, 210 insertions, 0 deletions
diff --git a/devtools/client/netmonitor/test/browser_net_new_request_panel_context_menu.js b/devtools/client/netmonitor/test/browser_net_new_request_panel_context_menu.js new file mode 100644 index 0000000000..7aeb874852 --- /dev/null +++ b/devtools/client/netmonitor/test/browser_net_new_request_panel_context_menu.js @@ -0,0 +1,210 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +const asyncStorage = require("resource://devtools/shared/async-storage.js"); + +/** + * Test if the New Request Panel shows up as a expected + * when opened from an existing request + */ + +add_task(async function () { + // Turn true the pref + await pushPref("devtools.netmonitor.features.newEditAndResend", true); + // Reset the storage for the persisted custom request + await asyncStorage.removeItem("devtools.netmonitor.customRequest"); + + const { tab, monitor } = await initNetMonitor(POST_DATA_URL, { + requestCount: 1, + }); + info("Starting test... "); + + const { document, store, windowRequire, connector } = monitor.panelWin; + + // Action should be processed synchronously in tests. + const Actions = windowRequire("devtools/client/netmonitor/src/actions/index"); + store.dispatch(Actions.batchEnable(false)); + + await performRequests(monitor, tab, 2); + + const { getSelectedRequest } = windowRequire( + "devtools/client/netmonitor/src/selectors/index" + ); + + const expectedURLQueryParams = [ + { + name: "foo", + value: "bar", + }, + { name: "baz", value: "42" }, + { name: "valueWithEqualSign", value: "hijk=123=mnop" }, + { name: "type", value: "urlencoded" }, + ]; + + info("selecting first request"); + const firstRequestItem = document.querySelectorAll(".request-list-item")[0]; + const waitForHeaders = waitUntil(() => + document.querySelector(".headers-overview") + ); + EventUtils.sendMouseEvent({ type: "mousedown" }, firstRequestItem); + await waitForHeaders; + EventUtils.sendMouseEvent({ type: "contextmenu" }, firstRequestItem); + + ok( + getContextMenuItem(monitor, "request-list-context-resend-only"), + "The 'Resend' item is visible when there is a clicked request" + ); + + info("Opening the new request panel"); + const waitForPanels = waitUntil( + () => + document.querySelector(".http-custom-request-panel") && + document.querySelector("#http-custom-request-send-button").disabled === + false + ); + + await selectContextMenuItem(monitor, "request-list-context-edit-resend"); + await waitForPanels; + + is( + !!document.querySelector( + ".devtools-button.devtools-http-custom-request-icon.checked" + ), + true, + "The toolbar button should be highlighted" + ); + + const request = getSelectedRequest(store.getState()); + + // Verify if the default state contains the data from the request + const methodValue = document.querySelector(".http-custom-method-value"); + is( + methodValue.value, + request.method, + "The method in the form should match the request we clicked" + ); + + const urlValue = document.querySelector(".http-custom-url-value"); + is( + urlValue.textContent, + request.url, + "The URL in the form should match the request we clicked" + ); + + const urlParametersValues = document.querySelectorAll( + "#http-custom-query .tabpanel-summary-container.http-custom-input" + ); + is( + urlParametersValues.length, + 4, + "The URL Parameters length in the form should match the request we clicked" + ); + + for (let i = 0; i < urlParametersValues.length; i++) { + const { name, value } = expectedURLQueryParams[i]; + const [formName, formValue] = + urlParametersValues[i].querySelectorAll("textarea"); + is( + name, + formName.value, + "The query param name in the form should match the request we clicked" + ); + is( + value, + formValue.value, + "The query param value in the form should match the request we clicked" + ); + } + + const headersValues = document.querySelectorAll( + "#http-custom-headers .tabpanel-summary-container.http-custom-input" + ); + Assert.greaterOrEqual( + headersValues.length, + 6, + "The headers length in the form should match the request we clicked" + ); + + for (const { name, value } of request.requestHeaders.headers) { + const found = Array.from(headersValues).find(item => { + const [formName, formValue] = item.querySelectorAll("textarea"); + if (formName.value === name && formValue.value === value) { + return true; + } + return false; + }); + + ok(found, "The header was found in the form"); + } + + // Wait to the post body because it is only updated in the componentWillMount + const postValue = document.querySelector("#http-custom-postdata-value"); + await waitUntil(() => postValue.textContent !== ""); + is( + postValue.value, + request.requestPostData.postData.text, + "The Post body input value in the form should match the request we clicked" + ); + + info( + "Uncheck the header an make sure the header is removed from the new request" + ); + const headers = document.querySelectorAll( + "#http-custom-headers .tabpanel-summary-container.http-custom-input" + ); + + const lastHeader = Array.from(headers).pop(); + const checkbox = lastHeader.querySelector("input"); + checkbox.click(); + + info("Click on the button to send a new request"); + const waitUntilEventsDisplayed = waitForNetworkEvents(monitor, 1); + const buttonSend = document.querySelector("#http-custom-request-send-button"); + buttonSend.click(); + await waitUntilEventsDisplayed; + + const newRequestSelectedId = getSelectedRequest(store.getState()).id; + await connector.requestData(newRequestSelectedId, "requestHeaders"); + const updatedSelectedRequest = getSelectedRequest(store.getState()); + + let found = updatedSelectedRequest.requestHeaders.headers.some( + item => item.name == "My-header-2" && item.value == "my-value-2" + ); + + is( + found, + false, + "The header unchecked should not be found on the headers list" + ); + + info( + "Delete the header and make sure the header is removed in the custom request panel" + ); + const buttonDelete = lastHeader.querySelector("button"); + buttonDelete.click(); + + const headersValue = document.querySelectorAll( + "#http-custom-headers .tabpanel-summary-container.http-custom-input textarea" + ); + found = Array.from(headersValue).some( + item => item.name == "My-header-2" && item.value == "my-value-2" + ); + is(found, false, "The header delete should not be found on the headers form"); + + info( + "Change the request selected to make sure the request in the custom request panel does not change" + ); + const previousRequest = document.querySelectorAll(".request-list-item")[0]; + EventUtils.sendMouseEvent({ type: "mousedown" }, previousRequest); + + const urlValueChanged = document.querySelector(".http-custom-url-value"); + is( + urlValue.textContent, + urlValueChanged.textContent, + "The url should not change when click on a new request" + ); + + await teardown(monitor); +}); |