diff --git a/public/externalLibs/inspector/inspector.js b/public/externalLibs/inspector/inspector.js index 51b651f0d6..40bcd7017c 100644 --- a/public/externalLibs/inspector/inspector.js +++ b/public/externalLibs/inspector/inspector.js @@ -1,225 +1,4 @@ (function (exports) { - var container = document.createElement('div'); - container.id = 'inspector-container'; - - const builtins = [ - 'Infinity', - 'NaN', - 'accumulate', - 'alert', - 'append', - 'apply_in_underlying_javascript', - 'array_length', - 'assoc', - 'black', - 'blue', - 'brown', - 'build_list', - 'build_stream', - 'color', - 'display', - 'display_list', - 'draw_data', - 'enum_list', - 'enum_stream', - 'equal', - 'error', - 'eval_stream', - 'filter', - 'for_each', - 'get_time', - 'green', - 'has_own_property', - 'head', - 'indigo', - 'integers_from', - 'is', - 'is_NaN', - 'is_array', - 'is_boolean', - 'is_function', - 'is_list', - 'is_null', - 'is_number', - 'is_object', - 'is_pair', - 'is_stream', - 'is_string', - 'is_undefined', - 'length', - 'list', - 'list_ref', - 'list_to_stream', - 'list_to_string', - 'map', - 'math_E', - 'math_LN10', - 'math_LN2', - 'math_LOG10E', - 'math_LOG2E', - 'math_PI', - 'math_SQRT1_2', - 'math_SQRT2', - 'math_abs', - 'math_acos', - 'math_acosh', - 'math_asin', - 'math_asinh', - 'math_atan', - 'math_atan2', - 'math_atanh', - 'math_cbrt', - 'math_ceil', - 'math_clz32', - 'math_cos', - 'math_cosh', - 'math_exp', - 'math_expm1', - 'math_floor', - 'math_fround', - 'math_hypot', - 'math_imul', - 'math_log', - 'math_log10', - 'math_log1p', - 'math_log2', - 'math_max', - 'math_min', - 'math_pow', - 'math_random', - 'math_round', - 'math_sign', - 'math_sin', - 'math_sinh', - 'math_sqrt', - 'math_tan', - 'math_tanh', - 'math_toSource', - 'math_trunc', - 'member', - 'orange', - 'pair', - 'parse', - 'parse_int', - 'pink', - 'prompt', - 'purple', - 'quarter_turn_left', - 'quarter_turn_right', - 'random_color', - 'raw_display', - 'red', - 'remove', - 'remove_all', - 'reverse', - 'rotate', - 'runtime', - 'scale', - 'scale_independent', - 'set_head', - 'set_tail', - 'show', - 'stack', - 'stack_frac', - 'stackn', - 'stream', - 'stream_append', - 'stream_filter', - 'stream_for_each', - 'stream_length', - 'stream_map', - 'stream_member', - 'stream_ref', - 'stream_remove', - 'stream_remove_all', - 'stream_reverse', - 'stream_tail', - 'stream_to_list', - 'stringify', - 'tail', - 'translate', - 'undefined', - 'white', - 'yellow' - ]; - - function filter(str) { - // regex to match: replacement for match - swapTable = { - programEnvironment: 'Program', - forLoopEnvironment: 'Body of for', - forBlockEnvironment: 'Control statement of for', - blockEnvironment: 'Block', - '[.]* => [.]*': ' => ', - '{[\\s\\S]*}': '{...}', - 'Symbol.*': '-' - }; - for (var r in swapTable) { - str = str.replace(new RegExp(r), swapTable[r]); - } - return str; - } - - function updateContext(context, stringify) { - // Hides the default text - const defaultText = document.getElementById('inspector-default-text'); - if (defaultText) { - defaultText.hidden = true; - } - - function dumpTable(env) { - var res = ''; - for (var k in env) { - if (builtins.indexOf('' + k) < 0) { - var str = filter(stringify(env[k])); - res += - '' + - k + - '' + - '' + - filter(str) + - ''; - } - } - return res.length > 0 ? res : undefined; - } - - function drawOutput() { - var frames = context.context.runtime.environments; - container.innerHTML = ''; - for (var frame of frames) { - var envtoString = dumpTable(frame.head); - if (envtoString == undefined) { - // skipping either empty frame or perhaps the global - continue; - } - var newtable = document.createElement('table'); - newtable.classList.add('inspect-scope-table'); - newtable.innerHTML = ''; - var tbody = document.createElement('tbody'); - tbody.innerHTML = - '
' + filter(frame.name) + '' + envtoString; - newtable.appendChild(tbody); - container.appendChild(newtable); - } - } - - // icon to blink - const icon = document.getElementById('inspector-icon'); - - if (context) { - drawOutput(); - if (icon) { - icon.classList.add('side-content-tab-alert'); // this blinks the icon - } - } else if (icon) { - // here we have no context! don't alert the inspector... - document.getElementById('inspector-default-text').hidden = false; - icon.classList.remove('side-content-tab-alert'); - container.innerHTML = ''; - } - } - function highlightClean() { var gutterCells = document.getElementsByClassName('ace_gutter-cell'); var aceLines = document.getElementsByClassName('ace_line'); @@ -241,12 +20,6 @@ } exports.Inspector = { - builtins, - filter, - init: function (parent) { - parent.appendChild(container); - }, - updateContext, highlightLine, highlightClean }; diff --git a/src/commons/mobileWorkspace/mobileSideContent/MobileSideContent.tsx b/src/commons/mobileWorkspace/mobileSideContent/MobileSideContent.tsx index 5921d91edc..292e6553bc 100644 --- a/src/commons/mobileWorkspace/mobileSideContent/MobileSideContent.tsx +++ b/src/commons/mobileWorkspace/mobileSideContent/MobileSideContent.tsx @@ -89,7 +89,7 @@ const MobileSideContent: React.FC = props => * would force React.useMemo to recompute the nullary function anyway */ const renderedPanels = () => { - // TODO: Fix the CSS of all the panels (e.g. subst_visualizer, inspector, etc.) + // TODO: Fix the CSS of all the panels (e.g. subst_visualizer) const renderPanel = (tab: SideContentTab, workspaceLocation?: WorkspaceLocation) => { const tabBody: JSX.Element = workspaceLocation ? { @@ -175,7 +175,7 @@ const MobileSideContent: React.FC = props => /** * Remove the 'side-content-tab-alert' class that causes tabs flash. * To be run when tabs are changed. - * Currently this style is only used for the "Inspector" and "Env Visualizer" tabs. + * Currently this style is only used for the "Env Visualizer" tab. */ const resetAlert = (prevTabId: TabId) => { const iconId = generateIconId(prevTabId); diff --git a/src/commons/sagas/WorkspaceSaga.ts b/src/commons/sagas/WorkspaceSaga.ts index b262959aca..e7372b19cc 100644 --- a/src/commons/sagas/WorkspaceSaga.ts +++ b/src/commons/sagas/WorkspaceSaga.ts @@ -48,7 +48,6 @@ import { getRestoreExtraMethodsString, getStoreExtraMethodsString, highlightLine, - inspectorUpdate, makeElevatedContext, visualizeEnv } from '../utils/JsSlangHelper'; @@ -278,7 +277,6 @@ export default function* WorkspaceSaga(): SagaIterator { const workspaceLocation = action.payload.workspaceLocation; context = yield select((state: OverallState) => state.workspaces[workspaceLocation].context); yield put(actions.clearReplOutput(workspaceLocation)); - inspectorUpdate(undefined); highlightLine(undefined); yield put(actions.clearReplOutput(workspaceLocation)); context.runtime.break = false; @@ -564,7 +562,6 @@ function* updateInspector(workspaceLocation: WorkspaceLocation): SagaIterator { const start = lastDebuggerResult.context.runtime.nodes[0].loc.start.line - 1; const end = lastDebuggerResult.context.runtime.nodes[0].loc.end.line - 1; yield put(actions.highlightEditorLine([start, end], workspaceLocation)); - inspectorUpdate(lastDebuggerResult); visualizeEnv(lastDebuggerResult); } catch (e) { yield put(actions.highlightEditorLine([], workspaceLocation)); @@ -613,10 +610,6 @@ export function* evalCode( ): SagaIterator { context.runtime.debuggerOn = (actionType === EVAL_EDITOR || actionType === DEBUG_RESUME) && context.chapter > 2; - if (!context.runtime.debuggerOn && context.chapter > 2 && actionType !== EVAL_SILENT) { - // Interface not guaranteed to exist, e.g. mission editor. - inspectorUpdate(undefined); // effectively resets the interface - } // Logic for execution of substitution model visualizer const correctWorkspace = workspaceLocation === 'playground' || workspaceLocation === 'sicp'; diff --git a/src/commons/sagas/__tests__/WorkspaceSaga.ts b/src/commons/sagas/__tests__/WorkspaceSaga.ts index 1760331b2b..878fffc0d2 100644 --- a/src/commons/sagas/__tests__/WorkspaceSaga.ts +++ b/src/commons/sagas/__tests__/WorkspaceSaga.ts @@ -77,7 +77,6 @@ function generateDefaultState( beforeEach(() => { // Mock the inspector (window as any).Inspector = jest.fn(); - (window as any).Inspector.updateContext = jest.fn(); (window as any).Inspector.highlightClean = jest.fn(); (window as any).Inspector.highlightLine = jest.fn(); }); diff --git a/src/commons/sideContent/SideContent.tsx b/src/commons/sideContent/SideContent.tsx index 54945c0eac..c289ae98e2 100644 --- a/src/commons/sideContent/SideContent.tsx +++ b/src/commons/sideContent/SideContent.tsx @@ -134,7 +134,7 @@ const SideContent = (props: SideContentProps) => { /** * Remove the 'side-content-tab-alert' class that causes tabs flash. * To be run when tabs are changed. - * Currently this style is only used for the "Inspector" and "Env Visualizer" tabs. + * Currently this style is only used for the "Env Visualizer" tab. */ const resetAlert = (prevTabId: TabId) => { const iconId = generateIconId(prevTabId); diff --git a/src/commons/sideContent/SideContentInspector.tsx b/src/commons/sideContent/SideContentInspector.tsx deleted file mode 100644 index 0099fbc583..0000000000 --- a/src/commons/sideContent/SideContentInspector.tsx +++ /dev/null @@ -1,54 +0,0 @@ -import { Classes, NonIdealState, Spinner } from '@blueprintjs/core'; -import * as React from 'react'; - -type State = { - loading: boolean; -}; - -class SideContentInspector extends React.Component<{}, State> { - private $parent: HTMLElement | null = null; - - constructor(props: any) { - super(props); - this.state = { loading: true }; - } - - public componentDidMount() { - this.tryToLoad(); - } - - public render() { - return ( -
(this.$parent = r)} className="sa-inspector bp3-dark"> -

- The inspector generates a list of variable bindings based on breakpoints set in the - editor. -
-
- It is activated by clicking on the gutter of the editor (where all the line numbers are, - on the left) to set a breakpoint, and then running the program. Only the first line of a - statement can have a breakpoint. The program halts just before the statement is evaluated. -

- {this.state.loading && ( - } /> - )} -
- ); - } - - private tryToLoad = () => { - const element = (window as any).Inspector; - if (this.$parent && element) { - // Inspector has been loaded into the DOM - element.init(this.$parent); - this.setState((state, props) => { - return { loading: false }; - }); - } else { - // Try again in 1 second - window.setTimeout(this.tryToLoad, 1000); - } - }; -} - -export default SideContentInspector; diff --git a/src/commons/sideContent/SideContentTypes.ts b/src/commons/sideContent/SideContentTypes.ts index 71c6dac1b8..23a13fe54f 100644 --- a/src/commons/sideContent/SideContentTypes.ts +++ b/src/commons/sideContent/SideContentTypes.ts @@ -23,7 +23,6 @@ export enum SideContentType { envVisualizer = 'env_visualizer', grading = 'grading', introduction = 'introduction', - inspector = 'inspector', module = 'module', questionOverview = 'question_overview', remoteExecution = 'remote_execution', diff --git a/src/commons/utils/JsSlangHelper.ts b/src/commons/utils/JsSlangHelper.ts index c9ad338dda..33ecb46f90 100644 --- a/src/commons/utils/JsSlangHelper.ts +++ b/src/commons/utils/JsSlangHelper.ts @@ -130,14 +130,6 @@ export function highlightLine(line: number | undefined) { } } -export function inspectorUpdate(context: Context | undefined) { - if ((window as any).Inspector) { - (window as any).Inspector.updateContext(context, stringify); - } else { - throw new Error('Inspector not loaded'); - } -} - export const externalBuiltIns = { display, rawDisplay, diff --git a/src/pages/academy/sourcereel/Sourcereel.tsx b/src/pages/academy/sourcereel/Sourcereel.tsx index eb766766dd..b3f3c7eabe 100644 --- a/src/pages/academy/sourcereel/Sourcereel.tsx +++ b/src/pages/academy/sourcereel/Sourcereel.tsx @@ -14,7 +14,6 @@ import { ControlBarExternalLibrarySelect } from '../../../commons/controlBar/Con import { HighlightedLines, Position } from '../../../commons/editor/EditorTypes'; import SideContentDataVisualizer from '../../../commons/sideContent/SideContentDataVisualizer'; import SideContentEnvVisualizer from '../../../commons/sideContent/SideContentEnvVisualizer'; -import SideContentInspector from '../../../commons/sideContent/SideContentInspector'; import { SideContentTab, SideContentType } from '../../../commons/sideContent/SideContentTypes'; import SourceRecorderControlBar, { SourceRecorderControlBarProps @@ -345,7 +344,6 @@ class Sourcereel extends React.Component { toSpawn: () => true }, dataVisualizerTab, - inspectorTab, envVisualizerTab ], workspaceLocation: 'sourcereel' @@ -406,14 +404,6 @@ const dataVisualizerTab: SideContentTab = { toSpawn: () => true }; -const inspectorTab: SideContentTab = { - label: 'Inspector', - iconName: IconNames.SEARCH, - body: , - id: SideContentType.inspector, - toSpawn: () => true -}; - const envVisualizerTab: SideContentTab = { label: 'Env Visualizer', iconName: IconNames.GLOBE, diff --git a/src/pages/playground/Playground.tsx b/src/pages/playground/Playground.tsx index 86700464d0..0af9c8afc4 100644 --- a/src/pages/playground/Playground.tsx +++ b/src/pages/playground/Playground.tsx @@ -40,7 +40,6 @@ import MobileWorkspace, { import SideContentDataVisualizer from '../../commons/sideContent/SideContentDataVisualizer'; import SideContentEnvVisualizer from '../../commons/sideContent/SideContentEnvVisualizer'; import SideContentFaceapiDisplay from '../../commons/sideContent/SideContentFaceapiDisplay'; -import SideContentInspector from '../../commons/sideContent/SideContentInspector'; import SideContentRemoteExecution from '../../commons/sideContent/SideContentRemoteExecution'; import SideContentSubstVisualizer from '../../commons/sideContent/SideContentSubstVisualizer'; import { SideContentTab, SideContentType } from '../../commons/sideContent/SideContentTypes'; @@ -618,8 +617,7 @@ const Playground: React.FC = props => { props.sourceVariant !== 'non-det' && !usingRemoteExecution ) { - // Enable Inspector, Env Visualizer for Source Chapter 3 and above - tabs.push(inspectorTab); + // Enable Env Visualizer for Source Chapter 3 and above tabs.push(envVisualizerTab); } @@ -854,14 +852,6 @@ const FaceapiDisplayTab: SideContentTab = { toSpawn: () => true }; -const inspectorTab: SideContentTab = { - label: 'Inspector', - iconName: IconNames.SEARCH, - body: , - id: SideContentType.inspector, - toSpawn: () => true -}; - const envVisualizerTab: SideContentTab = { label: 'Env Visualizer', iconName: IconNames.GLOBE, diff --git a/src/pages/sourcecast/Sourcecast.tsx b/src/pages/sourcecast/Sourcecast.tsx index 769e00c584..4c9edca8bc 100644 --- a/src/pages/sourcecast/Sourcecast.tsx +++ b/src/pages/sourcecast/Sourcecast.tsx @@ -20,7 +20,6 @@ import MobileWorkspace, { } from '../../commons/mobileWorkspace/MobileWorkspace'; import SideContentDataVisualizer from '../../commons/sideContent/SideContentDataVisualizer'; import SideContentEnvVisualizer from '../../commons/sideContent/SideContentEnvVisualizer'; -import SideContentInspector from '../../commons/sideContent/SideContentInspector'; import { SideContentTab, SideContentType } from '../../commons/sideContent/SideContentTypes'; import SourceRecorderControlBar, { SourceRecorderControlBarProps @@ -259,7 +258,6 @@ const Sourcecast: React.FC = props => { toSpawn: () => true }, dataVisualizerTab, - inspectorTab, envVisualizerTab ]; @@ -389,14 +387,6 @@ const dataVisualizerTab: SideContentTab = { toSpawn: () => true }; -const inspectorTab: SideContentTab = { - label: 'Inspector', - iconName: IconNames.SEARCH, - body: , - id: SideContentType.inspector, - toSpawn: () => true -}; - const envVisualizerTab: SideContentTab = { label: 'Env Visualizer', iconName: IconNames.GLOBE, diff --git a/src/styles/_workspace.scss b/src/styles/_workspace.scss index 82a65c1552..3eb2a528a9 100755 --- a/src/styles/_workspace.scss +++ b/src/styles/_workspace.scss @@ -377,32 +377,6 @@ $code-color-error: #ff4444; } } - ##{$ns}-tab-panel_side-content-tabs_inspector { - overflow: hidden; - .inspect-scope-table { - width: 100%; - white-space: nowrap; - table-layout: fixed; - - tbody { - .inspect-table-obj-name { - width: 20%; - overflow: hidden; - text-overflow: ellipsis; - } - - .inspect-table-obj-details { - display: block; - code { - overflow: hidden; - text-overflow: ellipsis; - display: block; - } - } - } - } - } - // Specific CSS for the Stepper tab, since REPL is hidden ##{$ns}-tab-panel_side-content-tabs_subst_visualiser { height: calc(100% - 60px);