function run_test() {
let Cu = Components.utils;
const {require} = Cu.import("resource://devtools/shared/Loader.jsm", {});
const MDN_URL = "https://developer.mozilla.org/docs/";
const GTM_PARAMS_NM = "?utm_source=mozilla" +
"&utm_medium=devtools-netmonitor&utm_campaign=default";
const GTM_PARAMS_WC = "?utm_source=mozilla" +
"&utm_medium=devtools-webconsole&utm_campaign=default";
const {
getHeadersURL,
getHTTPStatusCodeURL,
getNetMonitorTimingsURL,
getPerformanceAnalysisURL
} = require("devtools/client/netmonitor/src/utils/mdn-utils");
info("Checking for supported headers");
equal(getHeadersURL("Accept"), `${MDN_URL}Web/HTTP/Headers/Accept${GTM_PARAMS_NM}`);
info("Checking for unsupported headers");
equal(getHeadersURL("Width"), null);
info("Checking for supported status code");
equal(getHTTPStatusCodeURL("200", "webconsole"),
`${MDN_URL}Web/HTTP/Status/200${GTM_PARAMS_WC}`);
info("Checking for unsupported status code");
equal(getHTTPStatusCodeURL("999", "webconsole"),
`${MDN_URL}Web/HTTP/Status${GTM_PARAMS_WC}`);
equal(getNetMonitorTimingsURL(),
`${MDN_URL}Tools/Network_Monitor${GTM_PARAMS_NM}#Timings`);
equal(getPerformanceAnalysisURL(),
`${MDN_URL}Tools/Network_Monitor${GTM_PARAMS_NM}#Performance_analysis`);
}
/**
* This component is responsible for rendering network messages
* in the Console panel.
*
* Network logs are expandable and the user can inspect it inline
* within the Console panel (no need to switch to the Network panel).
*
* HTTP details are rendered using `TabboxPanel` component used to
* render contents of the side bar in the Network panel.
*
* All HTTP details data are fetched from the backend on-demand
* when the user is expanding network log for the first time.
*/
function NetworkEventMessage({
message = {},
serviceContainer,
timestampsVisible,
networkMessageUpdate = {},
networkMessageActiveTabId,
dispatch,
open,
}) {
const {
id,
indent,
source,
type,
level,
request,
isXHR,
timeStamp,
} = message;
const {
response = {},
totalTime,
} = networkMessageUpdate;
const {
httpVersion,
status,
statusText,
} = response;
const topLevelClasses = [ "cm-s-mozilla" ];
let statusCode, statusInfo;
if (httpVersion && status && statusText !== undefined && totalTime !== undefined) {
const statusCodeDocURL = getHTTPStatusCodeURL(status.toString(), "webconsole");
statusCode = dom.span({
className: "status-code",
"data-code": status,
title: LEARN_MORE,
onClick: (e) => {
e.stopPropagation();
e.preventDefault();
serviceContainer.openLink(statusCodeDocURL, e);
}
}, status);
statusInfo = dom.span(
{className: "status-info"},
`[${httpVersion} `, statusCode, ` ${statusText} ${totalTime}ms]`
);
}
const toggle = () => {
if (open) {
dispatch(actions.messageClose(id));
} else {
dispatch(actions.messageOpen(id));
}
};
// Message body components.
const method = dom.span({className: "method" }, request.method);
const xhr = isXHR
? dom.span({ className: "xhr" }, l10n.getStr("webConsoleXhrIndicator"))
: null;
const requestUrl = dom.a({ className: "url", title: request.url, onClick: toggle },
request.url);
const statusBody = statusInfo
? dom.a({ className: "status", onClick: toggle }, statusInfo)
: null;
const messageBody = [xhr, method, requestUrl, statusBody];
// API consumed by Net monitor UI components. Most of the method
// are not needed in context of the Console panel (atm) and thus
// let's just provide empty implementation.
// Individual methods might be implemented step by step as needed.
const connector = {
viewSourceInDebugger: (url, line) => {
serviceContainer.onViewSourceInDebugger({url, line});
},
getLongString: (grip) => {
return serviceContainer.getLongString(grip);
},
getTabTarget: () => {},
getNetworkRequest: () => {},
sendHTTPRequest: () => {},
setPreferences: () => {},
triggerActivity: () => {},
requestData: (requestId, dataType) => {
return serviceContainer.requestData(requestId, dataType);
},
};
// Only render the attachment if the network-event is
// actually opened (performance optimization).
const attachment = open && dom.div({
className: "network-info network-monitor devtools-monospace"},
TabboxPanel({
connector,
activeTabId: networkMessageActiveTabId,
request: networkMessageUpdate,
sourceMapService: serviceContainer.sourceMapService,
openLink: serviceContainer.openLink,
selectTab: (tabId) => {
dispatch(actions.selectNetworkMessageTab(tabId));
},
hideToggleButton: true,
})
);
return Message({
dispatch,
messageId: id,
source,
type,
level,
indent,
collapsible: true,
open,
attachment,
topLevelClasses,
timeStamp,
messageBody,
serviceContainer,
request,
timestampsVisible,
});
}