web api interface
ReportingObserver
Available in workers
The ReportingObserver interface of the Reporting API allows you to collect and access reports.
Constructor
ReportingObserver()- : Creates a new
ReportingObserverobject instance, which can be used to collect and access reports.
- : Creates a new
Instance properties
This interface has no properties defined on it.
Instance methods
disconnect()- : Stops a reporting observer that had previously started observing from collecting reports.
observe()- : Instructs a reporting observer to start collecting reports in its report queue.
takeRecords()- : Returns the current list of reports contained in the observer’s report queue, and empties the queue.
Events
This interface has no events that fire on it.
Examples
Displaying deprecation reports
This example shows how to observe "deprecation" reports using a ReportingObserver.
<pre id="log"></pre>
#log {
height: 200px;
margin: 10px;
overflow: scroll;
padding: 0.5rem;
border: 1px solid black;
}
const logElement = document.querySelector("#log");
function log(text) {
logElement.innerText = `${logElement.innerText}${text}\n`;
logElement.scrollTop = logElement.scrollHeight;
}
JavaScript
First we construct a new ReportingObserver object to listen for reports with the type "deprecation", passing a callback that will receive and log the reports.
const options = {
types: ["deprecation"],
buffered: true,
};
const observer = new ReportingObserver((reports, observer) => {
reports.forEach((report) => {
// console.log(report);
log(JSON.stringify(report, null, 2));
});
}, options);
// Start the observer
observer.observe();
We then call the following code which uses synchronous XHR (deprecated API). Note that this is defined after the observer it triggers once the observer is running.
const xhr = new XMLHttpRequest();
xhr.open("GET", "/", false); // false = synchronous (deprecated)
xhr.send();
Results
On browsers that support deprecation reports, a report should be displayed below.
Note that the type is "deprecation".
Interactive exampleOpen the canonical MDN source to run this embedded demo.
Specifications
SpecificationsStandards references are available on the canonical MDN page.
Browser compatibility
Browser compatibilityCompatibility data is available on the canonical MDN page.