Skip to content

Commit ba779fa

Browse files
author
David Kutugata
authored
Add a setting to more clearly enable scrolling on cell outputs (#11222)
* Add a setting to enable/disable scrolling on output cells * update a setting description * added news file * make sure maxTextSize of -1 also disables the scrollbar * move repeated code into a function * added a constant
1 parent f1f2dfd commit ba779fa

File tree

18 files changed

+41
-7
lines changed

18 files changed

+41
-7
lines changed

‎news/2 Fixes/9801.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
Added 'Enable Scrolling For Cell Outputs' setting. Works together with the 'Max Output Size' setting.

‎package.json

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1753,7 +1753,13 @@
17531753
"python.dataScience.maxOutputSize": {
17541754
"type": "number",
17551755
"default": 400,
1756-
"description": "Maximum size (in pixels) of text output in the Python Interactive window before a scrollbar appears. Set to -1 for infinity.",
1756+
"description": "Maximum size (in pixels) of text output in the Python Interactive window and Notebook Editor before a scrollbar appears. First enable scrolling for cell outputs in settings.",
1757+
"scope": "resource"
1758+
},
1759+
"python.dataScience.enableScrollingForCellOutputs": {
1760+
"type": "boolean",
1761+
"default": true,
1762+
"description": "Enables scrolling for large cell outputs.",
17571763
"scope": "resource"
17581764
},
17591765
"python.dataScience.errorBackgroundColor": {

‎src/client/common/types.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -348,6 +348,7 @@ export interface IDataScienceSettings {
348348
showCellInputCode: boolean;
349349
collapseCellInputCodeByDefault: boolean;
350350
maxOutputSize: number;
351+
enableScrollingForCellOutputs: boolean;
351352
enableGather?: boolean;
352353
gatherToScript?: boolean;
353354
gatherSpecPath?: string;

‎src/datascience-ui/history-react/interactiveCell.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@ interface IInteractiveCellBaseProps {
3333
testMode?: boolean;
3434
autoFocus: boolean;
3535
maxTextSize?: number;
36+
enableScroll?: boolean;
3637
showWatermark: boolean;
3738
monacoTheme: string | undefined;
3839
editorOptions?: monacoEditor.editor.IEditorOptions;
@@ -154,6 +155,7 @@ export class InteractiveCell extends React.Component<IInteractiveCellProps> {
154155
baseTheme={this.props.baseTheme}
155156
expandImage={this.props.showPlot}
156157
maxTextSize={this.props.maxTextSize}
158+
enableScroll={this.props.enableScroll}
157159
themeMatplotlibPlots={themeMatplotlibPlots}
158160
widgetFailed={this.props.widgetFailed}
159161
/>

‎src/datascience-ui/history-react/interactivePanel.tsx

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -248,8 +248,6 @@ ${buildSettingsCss(this.props.settings)}`}</style>
248248
return null;
249249
}
250250

251-
const maxOutputSize = this.props.settings.maxOutputSize;
252-
const maxTextSize = maxOutputSize && maxOutputSize < 10000 && maxOutputSize > 0 ? maxOutputSize : undefined;
253251
const executionCount = this.getInputExecutionCount();
254252
const editPanelClass = this.props.settings.colorizeInputBox ? 'edit-panel-colorized' : 'edit-panel';
255253

@@ -259,7 +257,8 @@ ${buildSettingsCss(this.props.settings)}`}</style>
259257
<InteractiveCellComponent
260258
role="form"
261259
editorOptions={this.props.editorOptions}
262-
maxTextSize={maxTextSize}
260+
maxTextSize={this.getMaxTextSize(this.props.settings.maxOutputSize)}
261+
enableScroll={this.props.settings.enableScrollingForCellOutputs}
263262
autoFocus={document.hasFocus()}
264263
testMode={this.props.testMode}
265264
cellVM={this.props.editCellVM}
@@ -330,7 +329,8 @@ ${buildSettingsCss(this.props.settings)}`}</style>
330329
<InteractiveCellComponent
331330
role="listitem"
332331
editorOptions={this.props.editorOptions}
333-
maxTextSize={this.props.settings.maxOutputSize}
332+
maxTextSize={this.getMaxTextSize(this.props.settings.maxOutputSize)}
333+
enableScroll={this.props.settings.enableScrollingForCellOutputs}
334334
autoFocus={false}
335335
testMode={this.props.testMode}
336336
cellVM={cellVM}
@@ -377,6 +377,11 @@ ${buildSettingsCss(this.props.settings)}`}</style>
377377
private linkClick = (ev: MouseEvent) => {
378378
handleLinkClick(ev, this.props.linkClick);
379379
};
380+
381+
private getMaxTextSize(maxOutputSize: number): number | undefined {
382+
const outputSizeLimit = 10000;
383+
return maxOutputSize && maxOutputSize < outputSizeLimit && maxOutputSize > 0 ? maxOutputSize : undefined;
384+
}
380385
}
381386

382387
// Main export, return a redux connected editor

‎src/datascience-ui/interactive-common/cellOutput.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,7 @@ interface ICellOutputProps {
3232
cellVM: ICellViewModel;
3333
baseTheme: string;
3434
maxTextSize?: number;
35+
enableScroll?: boolean;
3536
hideOutput?: boolean;
3637
themeMatplotlibPlots?: boolean;
3738
expandImage(imageHtml: string): void;
@@ -536,7 +537,7 @@ export class CellOutput extends React.Component<ICellOutputProps> {
536537
const style: React.CSSProperties = {};
537538

538539
// Create a scrollbar style if necessary
539-
if (transformedList.some((transformed) => transformed.output.renderWithScrollbars) && this.props.maxTextSize) {
540+
if (transformedList.some((transformed) => transformed.output.renderWithScrollbars) && this.props.enableScroll) {
540541
style.overflowY = 'auto';
541542
style.maxHeight = `${this.props.maxTextSize}px`;
542543
}

‎src/datascience-ui/native-editor/nativeCell.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@ interface INativeCellBaseProps {
4444
codeTheme: string;
4545
testMode?: boolean;
4646
maxTextSize?: number;
47+
enableScroll?: boolean;
4748
monacoTheme: string | undefined;
4849
lastCell: boolean;
4950
firstCell: boolean;
@@ -716,6 +717,7 @@ export class NativeCell extends React.Component<INativeCellProps> {
716717
baseTheme={this.props.baseTheme}
717718
expandImage={this.props.showPlot}
718719
maxTextSize={this.props.maxTextSize}
720+
enableScroll={this.props.enableScroll}
719721
themeMatplotlibPlots={themeMatplotlibPlots}
720722
widgetFailed={this.props.widgetFailed}
721723
/>

‎src/datascience-ui/native-editor/nativeEditor.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -265,12 +265,18 @@ ${buildSettingsCss(this.props.settings)}`}</style>
265265
/>
266266
) : null;
267267

268+
const maxOutputSize = this.props.settings.maxOutputSize;
269+
const outputSizeLimit = 10000;
270+
const maxTextSize =
271+
maxOutputSize && maxOutputSize < outputSizeLimit && maxOutputSize > 0 ? maxOutputSize : undefined;
272+
268273
return (
269274
<div key={cellVM.cell.id} id={cellVM.cell.id}>
270275
<ErrorBoundary>
271276
<ConnectedNativeCell
272277
role="listitem"
273-
maxTextSize={this.props.settings.maxOutputSize}
278+
maxTextSize={maxTextSize}
279+
enableScroll={this.props.settings.enableScrollingForCellOutputs}
274280
testMode={this.props.testMode}
275281
cellVM={cellVM}
276282
baseTheme={this.props.baseTheme}

‎src/datascience-ui/react-common/settingsReactSide.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ export function getDefaultSettings() {
2424
showCellInputCode: true,
2525
collapseCellInputCodeByDefault: true,
2626
maxOutputSize: 400,
27+
enableScrollingForCellOutputs: true,
2728
errorBackgroundColor: '#FFFFFF',
2829
sendSelectionToInteractiveWindow: false,
2930
markdownRegularExpression: '^(#\\s*%%\\s*\\[markdown\\]|#\\s*\\<markdowncell\\>)',

‎src/test/common/configSettings/configSettings.unit.test.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -299,6 +299,7 @@ suite('Python Settings', async () => {
299299
collapseCellInputCodeByDefault: true,
300300
allowInput: true,
301301
maxOutputSize: 400,
302+
enableScrollingForCellOutputs: true,
302303
errorBackgroundColor: '#FFFFFF',
303304
sendSelectionToInteractiveWindow: false,
304305
variableExplorerExclude: 'module;function;builtin_function_or_method',

‎src/test/datascience/color.test.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -65,6 +65,7 @@ suite('Theme colors', () => {
6565
collapseCellInputCodeByDefault: true,
6666
allowInput: true,
6767
maxOutputSize: 400,
68+
enableScrollingForCellOutputs: true,
6869
errorBackgroundColor: '#FFFFFF',
6970
sendSelectionToInteractiveWindow: false,
7071
variableExplorerExclude: 'module;function;builtin_function_or_method',

‎src/test/datascience/dataScienceIocContainer.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1392,6 +1392,7 @@ export class DataScienceIocContainer extends UnitTestIocContainer {
13921392
collapseCellInputCodeByDefault: true,
13931393
allowInput: true,
13941394
maxOutputSize: 400,
1395+
enableScrollingForCellOutputs: true,
13951396
errorBackgroundColor: '#FFFFFF',
13961397
sendSelectionToInteractiveWindow: false,
13971398
codeRegularExpression: '^(#\\s*%%|#\\s*\\<codecell\\>|#\\s*In\\[\\d*?\\]|#\\s*In\\[ \\])',

‎src/test/datascience/editor-integration/codewatcher.unit.test.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -80,6 +80,7 @@ suite('DataScience Code Watcher Unit Tests', () => {
8080
collapseCellInputCodeByDefault: true,
8181
allowInput: true,
8282
maxOutputSize: 400,
83+
enableScrollingForCellOutputs: true,
8384
errorBackgroundColor: '#FFFFFF',
8485
sendSelectionToInteractiveWindow: false,
8586
variableExplorerExclude: 'module;function;builtin_function_or_method',

‎src/test/datascience/execution.unit.test.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -894,6 +894,7 @@ suite('Jupyter Execution', async () => {
894894
collapseCellInputCodeByDefault: true,
895895
allowInput: true,
896896
maxOutputSize: 400,
897+
enableScrollingForCellOutputs: true,
897898
errorBackgroundColor: '#FFFFFF',
898899
sendSelectionToInteractiveWindow: false,
899900
variableExplorerExclude: 'module;function;builtin_function_or_method',

‎src/test/datascience/helpers.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ export function defaultDataScienceSettings(): IDataScienceSettings {
2323
collapseCellInputCodeByDefault: true,
2424
allowInput: true,
2525
maxOutputSize: 400,
26+
enableScrollingForCellOutputs: true,
2627
errorBackgroundColor: '#FFFFFF',
2728
sendSelectionToInteractiveWindow: false,
2829
variableExplorerExclude: 'module;function;builtin_function_or_method',

‎src/test/datascience/interactiveWindowCommandListener.unit.test.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -132,6 +132,7 @@ suite('Interactive window command listener', async () => {
132132
collapseCellInputCodeByDefault: true,
133133
allowInput: true,
134134
maxOutputSize: 400,
135+
enableScrollingForCellOutputs: true,
135136
errorBackgroundColor: '#FFFFFF',
136137
sendSelectionToInteractiveWindow: false,
137138
variableExplorerExclude: 'module;function;builtin_function_or_method',

‎src/test/datascience/jupyter/serverCache.unit.test.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,7 @@ suite('Data Science - ServerCache', () => {
4040
collapseCellInputCodeByDefault: true,
4141
allowInput: true,
4242
maxOutputSize: 400,
43+
enableScrollingForCellOutputs: true,
4344
errorBackgroundColor: '#FFFFFF',
4445
sendSelectionToInteractiveWindow: false,
4546
variableExplorerExclude: 'module;function;builtin_function_or_method',

‎src/test/datascience/jupyterVariables.unit.test.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -87,6 +87,7 @@ suite('JupyterVariables', () => {
8787
collapseCellInputCodeByDefault: true,
8888
allowInput: true,
8989
maxOutputSize: 400,
90+
enableScrollingForCellOutputs: true,
9091
errorBackgroundColor: '#FFFFFF',
9192
sendSelectionToInteractiveWindow: false,
9293
variableExplorerExclude: 'module;function;builtin_function_or_method',

0 commit comments

Comments
 (0)