bring up to date and add tests

Author: pwjablonski

src/actions/index.js

@@ -27,15 +27,6 @@ import {
   editorBlurred,
   editorFocused,
   editorFocusedRequestedLine,
-<<<<<<< HEAD
-<<<<<<< HEAD
-=======
-  editorResized,
-=======
->>>>>>> e90fafb... update window resize, update element highlighter, write unit test
-  dragRowDivider,
-  dragColumnDivider,
->>>>>>> 66eba11... changes
   startDragColumnDivider,
   stopDragColumnDivider,
   notificationTriggered,
@@ -45,13 +36,10 @@ import {
   toggleEditorTextSize,
   toggleTopBarMenu,
   closeTopBarMenu,
-<<<<<<< HEAD
   startEditingInstructions,
   cancelEditingInstructions,
   showSaveIndicator,
   hideSaveIndicator,
-=======
->>>>>>> fa1acd3... Element Highlighter
 } from './ui';
 
 import {
@@ -68,7 +56,6 @@ import {
   userLoggedOut,
 } from './user';
 
-<<<<<<< HEAD
 import {
   projectCompiled,
   projectCompilationFailed,
@@ -90,8 +77,6 @@ import {
   updateResizableFlex,
 } from './resizableFlex';
 
-=======
->>>>>>> fa1acd3... Element Highlighter
 export {
   clearConsoleEntries,
   consoleInputChanged,
@@ -114,17 +99,8 @@ export {
   editorBlurred,
   editorFocused,
   editorFocusedRequestedLine,
-<<<<<<< HEAD
-<<<<<<< HEAD
   previousConsoleHistory,
   nextConsoleHistory,
-=======
-  editorResized,
-=======
->>>>>>> e90fafb... update window resize, update element highlighter, write unit test
-  dragRowDivider,
-  dragColumnDivider,
->>>>>>> 66eba11... changes
   startDragColumnDivider,
   stopDragColumnDivider,
   notificationTriggered,

src/actions/ui.js

@@ -21,19 +21,6 @@ export const editorBlurred = createAction(
   'EDITOR_BLURRED',
 );
 
-<<<<<<< HEAD
-export const editorResized = createAction(
-  'EDITOR_RESIZED',
-=======
-export const dragRowDivider = createAction(
-  'DRAG_ROW_DIVIDER',
-);
-
-export const dragColumnDivider = createAction(
-  'DRAG_COLUMN_DIVIDER',
->>>>>>> e90fafb... update window resize, update element highlighter, write unit test
-);
-
 export const startDragColumnDivider = createAction(
   'START_DRAG_COLUMN_DIVIDER',
 );

src/clients/github.js

@@ -4,12 +4,8 @@ import trim from 'lodash-es/trim';
 
 import retryingFailedImports from '../util/retryingFailedImports';
 import performWithRetries from '../util/performWithRetries';
-<<<<<<< HEAD
 import compileProject from '../util/compileProject';
 import ExtendableError from '../util/ExtendableError';
-=======
-import generatePreview from '../util/previewFrame';
->>>>>>> 621d5f6... Add saga, add ref to iframe element
 
 const COMMIT_MESSAGE = 'Created using Popcode: https://popcode.org';
 const MASTER = 'master';

src/components/Editor.jsx

@@ -1,6 +1,5 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-<<<<<<< HEAD
 import bindAll from 'lodash-es/bindAll';
 import constant from 'lodash-es/constant';
 import get from 'lodash-es/get';
@@ -9,14 +8,6 @@ import noop from 'lodash-es/noop';
 
 import {createAceEditor, createAceSessionWithoutWorker} from '../util/ace';
 import {EditorLocation} from '../records';
-import {cssSelectorAtCursor} from '../util/cssSelectorAtCursor';
-=======
-import ACE from 'brace';
-import bindAll from 'lodash/bindAll';
-import get from 'lodash/get';
-import throttle from 'lodash/throttle';
-import noop from 'lodash/noop';
->>>>>>> 621d5f6... Add saga, add ref to iframe element
 
 import 'brace/ext/searchbox';
 import 'brace/mode/html';
@@ -123,25 +114,6 @@ class Editor extends React.Component {
       this._startNewSession(this.props.source);
       this._resizeEditor();
       this._editor.on('focus', this._resizeEditor);
-<<<<<<< HEAD
-<<<<<<< HEAD
-<<<<<<< HEAD
-=======
-      this._editor.on('blur', () => {
-        this.props.onEditorBlurred();
-      });
-      this._editor.on('focus', () => {
-        this.props.onEditorFocused(this.props.language);
-      });
-=======
->>>>>>> ec49c81... Handle fixed potion, handle body and html, handle resize, handle editor refocus to same line
-      this._editor.setOptions({
-        fontFamily: 'Inconsolata',
-        fontSize: '14px',
-      });
->>>>>>> 23eb7f2... Updates to element highlighter
-=======
->>>>>>> e90fafb... update window resize, update element highlighter, write unit test
     } else {
       this._editor.destroy();
     }
@@ -183,15 +155,6 @@ class Editor extends React.Component {
     this._editor.moveCursorTo(0, 0);
     this._resizeEditor();
   }
-
-  render() {
-    return (
-      <div
-        className="editors__editor"
-        ref={this._setupEditor}
-      />
-    );
-  }
 }
 
 Editor.propTypes = {

src/components/EditorContainer.jsx

@@ -3,14 +3,10 @@ import PropTypes from 'prop-types';
 import React, {forwardRef} from 'react';
 import {t} from 'i18next';
 
-<<<<<<< HEAD
 const EditorContainer = forwardRef((
   {children, language, source, style, onHide},
   ref,
 ) => {
-=======
-function EditorContainer({children, language, source, style, onHide, onRef}) {
->>>>>>> fa1acd3... Element Highlighter
   let helpText;
 
   if (source === '') {

src/components/EditorsColumn.jsx

@@ -24,7 +24,9 @@ export default function EditorsColumn({
   requestedFocusedLine,
   onComponentHide,
   onComponentUnhide,
+  onEditorBlurred,
   onEditorCursorChange,
+  onEditorFocused,
   onEditorInput,
   onRef,
   onRequestedLineFocused,
@@ -69,7 +71,6 @@ export default function EditorsColumn({
           onCursorChange={onEditorCursorChange}
           onEditorBlurred={onEditorBlurred}
           onEditorFocused={onEditorFocused}
-          onEditorResized={onEditorResized}
           onInput={partial(
             onEditorInput,
             currentProject.projectKey,
@@ -138,6 +139,7 @@ EditorsColumn.propTypes = {
   style: PropTypes.object.isRequired,
   onComponentHide: PropTypes.func.isRequired,
   onComponentUnhide: PropTypes.func.isRequired,
+  onEditorBlurred: PropTypes.func.isRequired,
   onEditorCursorChange: PropTypes.func.isRequired,
   onEditorFocused: PropTypes.func.isRequired,
   onEditorInput: PropTypes.func.isRequired,

src/components/Preview.jsx

@@ -8,7 +8,7 @@ import PreviewFrame from './PreviewFrame';
 export default function Preview({
   compiledProjects,
   consoleEntries,
-  highlighterSelector,
+  focusedSelector,
   showingErrors,
   onConsoleError,
   onConsoleLog,
@@ -25,6 +25,7 @@ export default function Preview({
     <PreviewFrame
       compiledProject={compiledProject}
       consoleEntries={consoleEntries}
+      focusedSelector={focusedSelector}
       isActive={key === compiledProjects.keySeq().last()}
       key={compiledProject.compiledProjectKey}
       onConsoleError={onConsoleError}
@@ -51,7 +52,6 @@ export default function Preview({
         >&#xf021;</span>
       </div>
       {projectFrames}
-      // focusedSelector={focusedSelector}
     </div>
   );
 }

src/components/PreviewFrame.jsx

@@ -18,7 +18,6 @@ const sandboxOptions = [
   'allow-popups-to-escape-sandbox',
   'allow-scripts',
   'allow-top-navigation',
-  'allow-same-origin',
 ].join(' ');
 
 let nextId = 1;
@@ -44,26 +43,11 @@ class PreviewFrame extends React.Component {
     );
   }
 
-  // componentWillReceiveProps(nextProps) {
-  //   if (nextProps.highlighterSelector !== this.props.highlighterSelector) {
-  //     this._postHighlighterSelectorToFrame(nextProps.highlighterSelector);
-  //   }
-  // }
-  // componentDidMount() {
-  //   window.addEventListener('message', this._onMessage);
-  //   this._postFocusedSelectorToFrame(this.props.focusedSelector);
-  // }
-
-  // componentWillReceiveProps(nextProps) {
-  //   if (nextProps.focusedSelector !== this.props.focusedSelector) {
-  //     this._postFocusedSelectorToFrame(nextProps.focusedSelector);
-  //   }
-  // }
-
   componentDidUpdate({consoleEntries: prevConsoleEntries}) {
     const {consoleEntries, isActive} = this.props;
 
     if (this._channel && isActive) {
+      this._postFocusedSelectorToFrame(this.props.focusedSelector);
       for (const [key, {expression}] of consoleEntries) {
         if (!prevConsoleEntries.has(key) && expression) {
           this._evaluateConsoleExpression(key, expression);
@@ -152,18 +136,11 @@ class PreviewFrame extends React.Component {
     this.props.onConsoleLog(printedValue, compiledProjectKey);
   }
 
-  _postHighlighterSelectorToFrame(selector) {
-    window.frames[0].postMessage(JSON.stringify({
-      type: 'highlightElement',
-      selector: {selector},
-    }), '*');
-  }
-
   _postFocusedSelectorToFrame(selector) {
-    this._frame_element.contentWindow.postMessage(JSON.stringify({
-      type: 'org.popcode.highlightElement',
-      selector,
-    }), '*');
+    this._channel.notify({
+      method: 'highlightElement',
+      params: selector,
+    });
   }
 
   _attachToFrame(frame) {

src/components/TopBar/CurrentUser.jsx

@@ -1,3 +1,4 @@
+import classnames from 'classnames';
 import React from 'react';
 import PropTypes from 'prop-types';
 import {t} from 'i18next';

src/components/TopBar/CurrentUserMenu.jsx

@@ -1,8 +1,6 @@
 import PropTypes from 'prop-types';
 import React, {Fragment} from 'react';
 import {t} from 'i18next';
-import createMenu, {MenuItem} from './createMenu';
-import CurrentUserButton from './CurrentUserButton';
 
 import createMenu, {MenuItem} from './createMenu';
 import CurrentUserButton from './CurrentUserButton';