1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
|
/* 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: "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,
3,
"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"
);
ok(
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);
});
|
