71 lines
2.3 KiB
JavaScript
71 lines
2.3 KiB
JavaScript
/**
|
|
* Copyright (c) 2015-present, Facebook, Inc.
|
|
* All rights reserved.
|
|
*
|
|
* This source code is licensed under the BSD-style license found in the
|
|
* LICENSE file in the root directory of this source tree. An additional grant
|
|
* of patent rights can be found in the PATENTS file in the same directory.
|
|
*/
|
|
|
|
import { applyStyles } from '../utils/dom/css';
|
|
import { containerStyle, overlayStyle, headerStyle } from '../styles';
|
|
import { createClose } from './close';
|
|
import { createFrames } from './frames';
|
|
import { createFooter } from './footer';
|
|
|
|
import { updateAdditional } from './additional';
|
|
|
|
|
|
function createOverlay(document, name, message, frames, contextSize, currentError, totalErrors, switchCallback, closeCallback) {
|
|
var frameSettings = frames.map(function () {
|
|
return { compiled: false };
|
|
});
|
|
// Create overlay
|
|
var overlay = document.createElement('div');
|
|
applyStyles(overlay, overlayStyle);
|
|
|
|
// Create container
|
|
var container = document.createElement('div');
|
|
applyStyles(container, containerStyle);
|
|
overlay.appendChild(container);
|
|
container.appendChild(createClose(document, closeCallback));
|
|
|
|
// Create "Errors X of Y" in case of multiple errors
|
|
var additional = document.createElement('div');
|
|
updateAdditional(document, additional, currentError, totalErrors, switchCallback);
|
|
container.appendChild(additional);
|
|
|
|
// Create header
|
|
var header = document.createElement('div');
|
|
applyStyles(header, headerStyle);
|
|
|
|
// Make message prettier
|
|
var finalMessage = message.match(/^\w*:/) || !name ? message : name + ': ' + message;
|
|
|
|
finalMessage = finalMessage
|
|
// TODO: maybe remove this prefix from fbjs?
|
|
// It's just scaring people
|
|
.replace(/^Invariant Violation:\s*/, '')
|
|
// This is not helpful either:
|
|
.replace(/^Warning:\s*/, '')
|
|
// Break the actionable part to the next line.
|
|
// AFAIK React 16+ should already do this.
|
|
.replace(' Check the render method', '\n\nCheck the render method').replace(' Check your code at', '\n\nCheck your code at');
|
|
|
|
// Put it in the DOM
|
|
header.appendChild(document.createTextNode(finalMessage));
|
|
container.appendChild(header);
|
|
|
|
// Create trace
|
|
container.appendChild(createFrames(document, frames, frameSettings, contextSize, name));
|
|
|
|
// Show message
|
|
container.appendChild(createFooter(document));
|
|
|
|
return {
|
|
overlay: overlay,
|
|
additional: additional
|
|
};
|
|
}
|
|
|
|
export { createOverlay }; |