<commit_before>var React = require('react');
var DOMParser = window.DOMParser;

var parser = new DOMParser();
var libraries = require('../config').libraries;

var Preview = React.createClass({
  propTypes: {
    project: React.PropTypes.object.isRequired,
  },

  _generateDocument: function() {
    var project = this.props.project;

    if (project === undefined) {
      return '';
    }

    var previewDocument = parser.parseFromString(
      project.sources.html, 'text/html');

    var previewHead = previewDocument.head;
    var previewBody = previewDocument.body;

    project.enabledLibraries.forEach(function(libraryKey) {
      var library = libraries[libraryKey];
      var css = library.css;
      var javascript = library.javascript;
      if (css !== undefined) {
        var linkTag = previewDocument.createElement('link');
        linkTag.rel = 'stylesheet';
        linkTag.href = css;
        previewHead.appendChild(linkTag);
      }
      if (javascript !== undefined) {
        var scriptTag = previewDocument.createElement('script');
        scriptTag.src = javascript;
        previewBody.appendChild(scriptTag);
      }
    });

    var styleTag = previewDocument.createElement('style');
    styleTag.innerHTML = project.sources.css;
    previewHead.appendChild(styleTag);
    var scriptTag = previewDocument.createElement('script');
    scriptTag.innerHTML = project.sources.javascript;
    previewBody.appendChild(scriptTag);

    return previewDocument.documentElement.outerHTML;
  },

  _popOut: function() {
    var doc = this._generateDocument();
    var url = 'data:text/html;base64,' + btoa(doc);
    window.open(url, 'preview');
  },

  render: function() {
    return (
      <div className="preview">
        <div className="preview-popOutButton" onClick={this._popOut} />
        <iframe className="preview-frame" srcDoc={this._generateDocument()} />
      </div>
    );
  },
});

module.exports = Preview;
<commit_msg>Errors in iframe are passed to application<commit_after>var React = require('react');
var DOMParser = window.DOMParser;

var parser = new DOMParser();
var libraries = require('../config').libraries;

var errorHandlerScript = '(' + (function() {
  window.onerror = function(fullMessage, _file, line, column, error) {
    var name, message;
    if (error) {
      name = error.name;
      message = error.message;
    } else {
      var components = fullMessage.split(': ', 2);
      if (components.length === 2) {
        name = components[0];
        message = components[1];
      } else {
        name = 'Error';
        message = fullMessage;
      }
    }

    window.parent.postMessage(JSON.stringify({
      type: 'org.popcode.error',
      error: {
        name: name,
        message: message,
        line: line,
        column: column,
      },
    }), '*');
  };
}.toString()) + '());';

var Preview = React.createClass({
  propTypes: {
    project: React.PropTypes.object.isRequired,
  },

  componentDidMount: function() {
    window.addEventListener('message', this._onRuntimeError);
  },

  componentWillUnmount: function() {
    window.removeEventListener('message', this._onRuntimeError);
  },

  _generateDocument: function() {
    var project = this.props.project;

    if (project === undefined) {
      return '';
    }

    var previewDocument = parser.parseFromString(
      project.sources.html,
      'text/html'
    );

    var previewHead = previewDocument.head;
    var previewBody = previewDocument.body;

    project.enabledLibraries.forEach(function(libraryKey) {
      var library = libraries[libraryKey];
      var css = library.css;
      var javascript = library.javascript;
      if (css !== undefined) {
        var linkTag = previewDocument.createElement('link');
        linkTag.rel = 'stylesheet';
        linkTag.href = css;
        previewHead.appendChild(linkTag);
      }
      if (javascript !== undefined) {
        var scriptTag = previewDocument.createElement('script');
        scriptTag.src = javascript;
        previewBody.appendChild(scriptTag);
      }
    });

    var styleTag = previewDocument.createElement('style');
    styleTag.innerHTML = project.sources.css;
    previewHead.appendChild(styleTag);
    var scriptTag = previewDocument.createElement('script');
    scriptTag.innerHTML =
      errorMessageScript + project.sources.javascript;
    previewBody.appendChild(scriptTag);

    return previewDocument.documentElement.outerHTML;
  },

  _onRuntimeError: function(message) {
  },

  _popOut: function() {
    var doc = this._generateDocument();
    var url = 'data:text/html;base64,' + btoa(doc);
    window.open(url, 'preview');
  },

  render: function() {
    return (
      <div className="preview">
        <div className="preview-popOutButton" onClick={this._popOut} />
        <iframe className="preview-frame" srcDoc={this._generateDocument()} />
      </div>
    );
  },
});

module.exports = Preview;

{'fraction_non_alphanumeric': 0.13232016210739614, 'fraction_numerical': 0.0016210739614994933, 'mean_word_length': 3.0326797385620914, 'pattern_counts': {'":': 0, '<': 11, '<?xml version=': 0, '>': 11, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '7218444', 'n_tokens_mistral': 1410, 'n_tokens_neox': 1359, 'n_words': 281}