<commit_before> /* eslint-disable no-console */

 /**
  * Demonstrates the rendered result of a Perseus question within an iframe
  *
  * This mounts an ItemRenderer or HintRenderer (depending on the content given)
  * and applies mobile styling if necessary
  */

const React = require('react');

const ItemRenderer = require('./item-renderer.jsx');
const HintRenderer = require('./hint-renderer.jsx');
const ArticleRenderer = require('./article-renderer.jsx');
const TouchEmulator = require('../lib/touch-emulator.js');

const PreviewFrame = React.createClass({
    propTypes: {
        isMobile: React.PropTypes.bool.isRequired,
    },

    getInitialState: function() {
        return {};
    },

    componentDidMount: function() {
        window.addEventListener("message", (event) => {
            const data = window.parent.iframeDataStore[event.data];

            if (data) {
                this.setState(data);
            }
        });

        window.parent.postMessage(
            window.frameElement.getAttribute("data-id"), "*");

        this._updateParentWithHeight();

        if (window.MutationObserver) {
            // To know when to update the parent with the new iframe content
            // height, we listen to DOM mutations inside the iframe and
            // update the parent with the latest height every time a
            // mutation is detected.
            this._observer = new MutationObserver(() => {
                this._updateParentWithHeight();
            });

            this._observer.observe(document.getElementById("measured"), {
                childList: true, subtree: true, attributes: true,
            });
        }

        // In addition to mutation observers, we also periodically check the
        // height to capture the result of animations.
        setInterval(() => {
            this._updateParentWithHeight();
        }, 500);

        if (this.props.isMobile) {
            TouchEmulator();
        }
    },

    componentWillUnmount() {
        if (this._observer) {
            this._observer.disconnect();
        }
    },

    _updateParentWithHeight: function() {
        let lowest = 0;
        ["#content-container", ".preview-measure"].forEach((selector) => {
            document.querySelectorAll(selector).forEach((element) => {
                lowest =
                    Math.max(lowest, element.getBoundingClientRect().bottom);<commit_msg>Make article previews scrollable again<commit_after> /* eslint-disable no-console */

 /**
  * Demonstrates the rendered result of a Perseus question within an iframe
  *
  * This mounts an ItemRenderer or HintRenderer (depending on the content given)
  * and applies mobile styling if necessary
  */

const React = require('react');

const ItemRenderer = require('./item-renderer.jsx');
const HintRenderer = require('./hint-renderer.jsx');
const ArticleRenderer = require('./article-renderer.jsx');
const TouchEmulator = require('../lib/touch-emulator.js');

const PreviewFrame = React.createClass({
    propTypes: {
        isMobile: React.PropTypes.bool.isRequired,
    },

    getInitialState: function() {
        return {};
    },

    componentDidMount: function() {
        window.addEventListener("message", (event) => {
            const data = window.parent.iframeDataStore[event.data];

            if (data) {
                this.setState(data);
            }
        });

        window.parent.postMessage(
            window.frameElement.getAttribute("data-id"), "*");

        this._updateParentWithHeight();

        if (window.MutationObserver) {
            // To know when to update the parent with the new iframe content
            // height, we listen to DOM mutations inside the iframe and
            // update the parent with the latest height every time a
            // mutation is detected.
            this._observer = new MutationObserver(() => {
                this._updateParentWithHeight();
            });

            this._observer.observe(document.getElementById("measured"), {
                childList: true, subtree: true, attributes: true,
            });
        }

        // In addition to mutation observers, we also periodically check the
        // height to capture the result of animations.
        setInterval(() => {
            this._updateParentWithHeight();
        }, 500);

        if (this.props.isMobile) {
            TouchEmulator();
        }

        // article-all means that we are rendering a full preview of an article
        if (this.state.type === "article-all") {
            document.body.style.overflow = "scroll";
        } else {
            document.body.style.overflow = "hidden";
        }
    },

    componentDidUpdate() {
        if (this.state.type === "article-all") {
            document.body.style.overflow = "scroll";
        } else {
            document.body.style.overflow = "hidden";
        }
    },

    componentWillUnmount() {
        if (this._observer) {
            this._observer.disconnect();
        }
    },

    _updateParentWithHeight: function() {
        let lowest = 0;
        ["#content-container", ".preview-measure"].forEach((selector) => {
            document.querySelectorAll(selector).forEach((element) => {
                lowest =
                    Math.max(lowest, element.getBoundingClientRect().bottom);
{'fraction_non_alphanumeric': 0.11703122078893251, 'fraction_numerical': 0.0014956066554496167, 'mean_word_length': 2.11046511627907, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 13, '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': '3999462', 'n_tokens_mistral': 1398, 'n_tokens_neox': 1329, 'n_words': 340}