`Programming exercises`: Configure file limits for Monaco Diff Editor #11475

ekayandan · 2025-10-09T16:40:38Z

Checklist

General

This is a small issue that I tested locally and was confirmed by another developer on a test server.
I chose a title conforming to the naming conventions for pull requests.

Motivation and Context

When diffs are too big between files (eg. csv files), Monaco Editor crashes browsers due to out-of-memory, as described in #11469. Limiting diff computation time and maximum file size should solve this issue.

Description

Added necessary configurations to limit computation time and file size.

Steps for Testing

Log in to Artemis
Navigate to any Programming Exercise Management Page, click on 'Edit in Editor', then 'Open Commit History'.

4. Click on a commit hash to see the diff editor. 5. Make sure view functions as expected (screenshot is from develop branch, for reference)

Testserver States

You can manage test servers using Helios. Check environment statuses in the environment list. To deploy to a test server, go to the CI/CD page, find your PR or branch, and trigger the deployment.

Review Progress

Code Review

Code Review 1

Manual Tests

Test 1

Summary by CodeRabbit

New Features
- Diff viewer now handles larger files and allows longer processing, improving reliability for big comparisons.
- Increased computation time limit to 3 seconds to better accommodate complex diffs.
- Enhancements apply to the diff editor only; the standard editor remains unchanged.

coderabbitai · 2025-10-09T16:44:35Z

Walkthrough

Adds Monaco DiffEditor initialization options in two places, setting maxFileSize to 20 and maxComputationTime to 3000. Changes are limited to diff editor creation/configuration and do not modify exports or standalone editor behavior.

Changes

Cohort / File(s)	Change Summary
Monaco Diff Editor configuration `src/main/webapp/app/programming/shared/utils/diff.utils.ts`, `src/main/webapp/app/shared/monaco-editor/service/monaco-editor.service.ts`	Added DiffEditor options: `maxFileSize: 20`, `maxComputationTime: 3000` during initialization. No public API changes; only affects diff editor setup.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Title Check	✅ Passed	The title concisely indicates that within the programming exercises context, the pull request configures file size limits for the Monaco Diff Editor. It directly reflects the main change of adding maxFileSize and maxComputationTime constraints and avoids vague or noisy wording. This specificity ensures a teammate scanning history understands the primary change.
Docstring Coverage	✅ Passed	Docstring coverage is 100.00% which is sufficient. The required threshold is 80.00%.
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.

✨ Finishing touches

📝 Generate docstrings

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch bugfix/limit-file-size-for-monaco

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

coderabbitai

Actionable comments posted: 1

🧹 Nitpick comments (1)

src/main/webapp/app/shared/monaco-editor/service/monaco-editor.service.ts (1)

82-83: Extract duplicated limits into shared constants and document their behavior.

Move 20 (MB) and 3000 (ms) from
src/.../service/monaco-editor.service.ts (lines 82–83) and
src/.../diff.utils.ts (lines 147–148) into a shared constants file.

In that file, clarify units and behavior on exceedance (timeout cancels diff; oversized files skip full diff).

Import and use those constants in both places.

📜 Review details

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 6c16c15 and 698f45d.

📒 Files selected for processing (2)

src/main/webapp/app/programming/shared/utils/diff.utils.ts (1 hunks)
src/main/webapp/app/shared/monaco-editor/service/monaco-editor.service.ts (1 hunks)

🧰 Additional context used

📓 Path-based instructions (1)

src/main/webapp/**/*.ts

⚙️ CodeRabbit configuration file

angular_style:https://angular.io/guide/styleguide;methods_in_html:false;lazy_loading:true;code_reuse:true;tests:meaningful;types:PascalCase;enums:PascalCase;funcs:camelCase;props:camelCase;no_priv_prefix:true;strings:single_quotes;localize:true;btns:functionality;links:navigation;icons_text:newline;labels:associate;code_style:arrow_funcs,curly_braces,open_braces_same_line,indent_4;memory_leak_prevention:true;routes:naming_schema;chart_framework:ngx-charts;responsive_layout:true

Files:

src/main/webapp/app/shared/monaco-editor/service/monaco-editor.service.ts
src/main/webapp/app/programming/shared/utils/diff.utils.ts

🧠 Learnings (3)

📓 Common learnings

Learnt from: ekayandan
PR: ls1intum/Artemis#10885
File: src/main/webapp/app/programming/shared/utils/diff.utils.ts:143-143
Timestamp: 2025-05-25T13:26:42.641Z
Learning: In Monaco Editor diff computation, creating a diff editor with a detached DOM element (not appended to document.body) is an intentional performance optimization to prevent rendering while still allowing diff calculation functionality to work properly.

📚 Learning: 2024-10-08T15:35:52.595Z

Learnt from: pzdr7
PR: ls1intum/Artemis#9407
File: src/main/webapp/app/shared/monaco-editor/monaco-editor.service.ts:66-66
Timestamp: 2024-10-08T15:35:52.595Z
Learning: In the `MonacoDiffEditorComponent` (`src/main/webapp/app/shared/monaco-editor/monaco-diff-editor.component.ts`), the diff editor is always set to read-only (`readOnly: true`), and there are currently no use cases that require editing in the diff view.

Applied to files:

src/main/webapp/app/shared/monaco-editor/service/monaco-editor.service.ts
src/main/webapp/app/programming/shared/utils/diff.utils.ts

📚 Learning: 2025-05-25T13:26:42.641Z

Learnt from: ekayandan
PR: ls1intum/Artemis#10885
File: src/main/webapp/app/programming/shared/utils/diff.utils.ts:143-143
Timestamp: 2025-05-25T13:26:42.641Z
Learning: In Monaco Editor diff computation, creating a diff editor with a detached DOM element (not appended to document.body) is an intentional performance optimization to prevent rendering while still allowing diff calculation functionality to work properly.

Applied to files:

src/main/webapp/app/programming/shared/utils/diff.utils.ts

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (10)

GitHub Check: Codacy Static Code Analysis
GitHub Check: Build and Push Docker Image / Build linux/arm64 Docker Image for ls1intum/artemis
GitHub Check: Build and Push Docker Image / Build linux/amd64 Docker Image for ls1intum/artemis
GitHub Check: Build .war artifact
GitHub Check: client-style
GitHub Check: client-tests-selected
GitHub Check: client-tests
GitHub Check: server-style
GitHub Check: server-tests
GitHub Check: Analyse

src/main/webapp/app/programming/shared/utils/diff.utils.ts

b-fein · 2025-10-09T17:49:55Z

src/main/webapp/app/programming/shared/utils/diff.utils.ts

            const diffEditor = monaco.editor.createDiffEditor(document.createElement('div'), {
                readOnly: true,
                automaticLayout: false,
+                maxFileSize: 20,


What unit is this size? Lines? kiB? Some comment would be helpful.
I guess the computation time below are milliseconds?

To add onto this: the input.constants.ts file provides a lot of constants, like e.g. MAX_FILE_SIZE, which you can use instead of a hardcoded value

https://microsoft.github.io/monaco-editor/typedoc/interfaces/editor.IStandaloneDiffEditorConstructionOptions.html#maxFileSize

20 is probably too high

github-actions · 2025-10-09T18:22:24Z

End-to-End (E2E) Test Results Summary

	Tests	Passed ✅	Skipped	Failed	Time ⏱
End-to-End (E2E) Test Report	1 ran	1 passed	0 skipped	0 failed	1s 623ms

Test	Result	Time ⏱
No test annotations available

ekayandan added 2 commits October 9, 2025 17:44

added size and time limitations for monaco diff calculation

ae161c4

missed one spot

698f45d

ekayandan requested review from a team and krusche as code owners October 9, 2025 16:40

github-project-automation bot added this to Artemis Development Oct 9, 2025

github-project-automation bot moved this to Work In Progress in Artemis Development Oct 9, 2025

github-actions bot assigned ekayandan Oct 9, 2025

github-actions bot added client Pull requests that update TypeScript code. (Added Automatically!) programming Pull requests that affect the corresponding module labels Oct 9, 2025

coderabbitai bot requested changes Oct 9, 2025

View reviewed changes

src/main/webapp/app/programming/shared/utils/diff.utils.ts Show resolved Hide resolved

github-project-automation bot moved this from Work In Progress to Ready For Review in Artemis Development Oct 9, 2025

ekayandan added the ready for review label Oct 9, 2025

coderabbitai bot approved these changes Oct 9, 2025

View reviewed changes

ekayandan added the bugfix label Oct 9, 2025

b-fein reviewed Oct 9, 2025

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

`Programming exercises`: Configure file limits for Monaco Diff Editor #11475

`Programming exercises`: Configure file limits for Monaco Diff Editor #11475

Uh oh!

ekayandan commented Oct 9, 2025 •

edited

Loading

Uh oh!

coderabbitai bot commented Oct 9, 2025 •

edited

Loading

Uh oh!

coderabbitai bot left a comment

Uh oh!

Uh oh!

b-fein Oct 9, 2025

Uh oh!

SamuelRoettgermann Oct 9, 2025

Uh oh!

krusche Oct 9, 2025

Uh oh!

krusche Oct 9, 2025

Uh oh!

github-actions bot commented Oct 9, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Programming exercises: Configure file limits for Monaco Diff Editor #11475

Are you sure you want to change the base?

Programming exercises: Configure file limits for Monaco Diff Editor #11475

Uh oh!

Conversation

ekayandan commented Oct 9, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Checklist

General

Motivation and Context

Description

Steps for Testing

Testserver States

Review Progress

Code Review

Manual Tests

Summary by CodeRabbit

Uh oh!

coderabbitai bot commented Oct 9, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

Pre-merge checks and finishing touches

Uh oh!

coderabbitai bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

b-fein Oct 9, 2025

Choose a reason for hiding this comment

Uh oh!

SamuelRoettgermann Oct 9, 2025

Choose a reason for hiding this comment

Uh oh!

krusche Oct 9, 2025

Choose a reason for hiding this comment

Uh oh!

krusche Oct 9, 2025

Choose a reason for hiding this comment

Uh oh!

github-actions bot commented Oct 9, 2025

End-to-End (E2E) Test Results Summary

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

`Programming exercises`: Configure file limits for Monaco Diff Editor #11475

`Programming exercises`: Configure file limits for Monaco Diff Editor #11475

ekayandan commented Oct 9, 2025 •

edited

Loading

coderabbitai bot commented Oct 9, 2025 •

edited

Loading