Skip to content

Commit 1745979

Browse files
sensei-hackersensei-hacker
authored
Merge pull request #2445 from Scavanger/Fix-JS-Programming-Tab
 JS Programming: Fix tab loading + Monaco editor import
2 parents 689378c + ef4b1c4 commit 1745979

File tree

3 files changed

+77
-138
lines changed

3 files changed

+77
-138
lines changed

‎.github/workflows/pr-branch-suggestion.yml‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
name: PR Branch Suggestion
2+
3+
on:
4+
pull_request_target:
5+
types: [opened]
6+
branches:
7+
- master
8+
9+
jobs:
10+
suggest-branch:
11+
runs-on: ubuntu-latest
12+
permissions:
13+
pull-requests: write
14+
steps:
15+
- name: Suggest maintenance branch
16+
uses: actions/github-script@v7
17+
with:
18+
script: |
19+
const comment = `### Branch Targeting Suggestion
20+
21+
You've targeted the \`master\` branch with this PR. Please consider if a version branch might be more appropriate:
22+
23+
- **\`maintenance-9.x\`** - If your change is backward-compatible and won't create compatibility issues between INAV firmware and Configurator 9.x versions. This will allow your PR to be included in the next 9.x release.
24+
25+
- **\`maintenance-10.x\`** - If your change introduces compatibility requirements between firmware and configurator that would break 9.x compatibility. This is for PRs which will be included in INAV 10.x
26+
27+
If \`master\` is the correct target for this change, no action is needed.
28+
29+
---
30+
*This is an automated suggestion to help route contributions to the appropriate branch.*`;
31+
32+
github.rest.issues.createComment({
33+
issue_number: context.issue.number,
34+
owner: context.repo.owner,
35+
repo: context.repo.repo,
36+
body: comment
37+
});

‎js/transpiler/editor/monaco_loader.js‎

Lines changed: 0 additions & 103 deletions
Original file line numberDiff line numberDiff line change
@@ -12,108 +12,6 @@
1212
import apiDefinitions from '../api/definitions/index.js';
1313
import { generateTypeDefinitions } from '../api/types.js';
1414

15-
/**
16-
* Load Monaco Editor
17-
* @returns {Promise<Object>} Promise that resolves with monaco object
18-
*/
19-
function loadMonacoEditor() {
20-
return new Promise((resolve, reject) => {
21-
try {
22-
// Check if already loaded
23-
if (window.monaco) {
24-
resolve(window.monaco);
25-
return;
26-
}
27-
28-
// In Vite/browser environment, use relative path to node_modules
29-
// Vite will handle module resolution
30-
const monacoBasePath = '/node_modules/monaco-editor';
31-
32-
// Use the min build which includes everything
33-
const vsPath = monacoBasePath + '/min/vs';
34-
35-
console.log('Loading Monaco from:', vsPath);
36-
37-
// Monaco requires AMD loader, so use that directly
38-
loadMonacoViaAMD(vsPath, resolve, reject);
39-
40-
} catch (error) {
41-
console.error('Failed to load Monaco Editor:', error);
42-
reject(error);
43-
}
44-
});
45-
}
46-
47-
/**
48-
* Load Monaco via AMD loader (fallback method)
49-
* @param {string} vsPath - Path to Monaco's vs directory
50-
* @param {Function} resolve - Promise resolve function
51-
* @param {Function} reject - Promise reject function
52-
*/
53-
function loadMonacoViaAMD(vsPath, resolve, reject) {
54-
// Validate vsPath to prevent potential injection issues
55-
// Only allow alphanumeric, forward slash, dash, dot, and underscore
56-
if (!/^[\/a-zA-Z0-9._-]+$/.test(vsPath)) {
57-
reject(new Error('Invalid Monaco base path'));
58-
return;
59-
}
60-
61-
// Set global MonacoEnvironment before loading
62-
window.MonacoEnvironment = {
63-
getWorkerUrl: function(workerId, label) {
64-
return `data:text/javascript;charset=utf-8,${encodeURIComponent(`
65-
self.MonacoEnvironment = {
66-
baseUrl: '${vsPath}'
67-
};
68-
importScripts('${vsPath}/base/worker/workerMain.js');
69-
`)}`;
70-
}
71-
};
72-
73-
const loaderScript = document.createElement('script');
74-
loaderScript.src = vsPath + '/loader.js';
75-
76-
loaderScript.onerror = () => {
77-
reject(new Error('Failed to load Monaco loader.js'));
78-
};
79-
80-
loaderScript.onload = () => {
81-
try {
82-
// Configure the loader
83-
window.require.config({
84-
paths: {
85-
'vs': vsPath
86-
},
87-
'vs/nls': {
88-
availableLanguages: {}
89-
}
90-
});
91-
92-
// Load the editor
93-
window.require(['vs/editor/editor.main'], function() {
94-
// Monaco is now available as a global
95-
const monaco = window.monaco;
96-
97-
if (!monaco || !monaco.editor) {
98-
console.error('Monaco object not properly initialized');
99-
reject(new Error('Monaco editor object not found'));
100-
return;
101-
}
102-
103-
console.log('Monaco loaded via AMD');
104-
resolve(monaco);
105-
}, function(err) {
106-
console.error('AMD require error:', err);
107-
reject(err);
108-
});
109-
} catch (err) {
110-
reject(err);
111-
}
112-
};
113-
114-
document.head.appendChild(loaderScript);
115-
}
116-
11715
/**
11816
* Initialize Monaco Editor with INAV-specific configuration
11917
* @param {Object} monaco - Monaco editor instance
@@ -212,7 +110,6 @@ function setupLinting(editor, lintCallback, debounceMs = 500) {
212110

213111
// Export functions
214112
export {
215-
loadMonacoEditor,
216113
initializeMonacoEditor,
217114
addINAVTypeDefinitions,
218115
setupLinting

‎tabs/javascript_programming.js‎

Lines changed: 40 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -10,16 +10,23 @@ import MSPChainerClass from './../js/msp/MSPchainer.js';
1010
import mspHelper from './../js/msp/MSPHelper.js';
1111
import { GUI, TABS } from './../js/gui.js';
1212
import FC from './../js/fc.js';
13-
import path from 'node:path';
1413
import i18n from './../js/localization.js';
1514
import { Transpiler } from './../js/transpiler/index.js';
1615
import { Decompiler } from './../js/transpiler/transpiler/decompiler.js';
1716
import * as MonacoLoader from './../js/transpiler/editor/monaco_loader.js';
18-
import apiDefinitions from './../js/transpiler/api/definitions/index.js';
19-
import { generateTypeDefinitions } from './../js/transpiler/api/types.js';
2017
import examples from './../js/transpiler/examples/index.js';
2118
import settingsCache from './../js/settingsCache.js';
19+
import * as monaco from 'monaco-editor';
20+
import tsWorker from 'monaco-editor/esm/vs/language/typescript/ts.worker?worker'
2221

22+
self.MonacoEnvironment = {
23+
getWorker(_, label) {
24+
if (label === 'typescript' || label === 'javascript') {
25+
return new tsWorker()
26+
}
27+
return new editorWorker()
28+
}
29+
}
2330

2431
TABS.javascript_programming = {
2532

@@ -39,40 +46,38 @@ TABS.javascript_programming = {
3946
GUI.active_tab = 'javascript_programming';
4047
}
4148

42-
$('#content').load("./tabs/javascript_programming.html", function () {
43-
44-
self.initTranspiler();
45-
46-
MonacoLoader.loadMonacoEditor()
47-
.then(function(monaco) {
48-
// Initialize editor with INAV configuration
49-
self.editor = MonacoLoader.initializeMonacoEditor(monaco, 'monaco-editor');
50-
51-
// Add INAV type definitions
52-
MonacoLoader.addINAVTypeDefinitions(monaco);
53-
54-
// Set up linting
55-
MonacoLoader.setupLinting(self.editor, function() {
56-
if (self.lintCode) {
57-
self.lintCode();
58-
}
59-
});
60-
61-
// Continue with initialization
62-
self.setupEventHandlers();
63-
self.loadExamples();
64-
65-
self.loadFromFC(function() {
66-
self.isDirty = false;
49+
import('./javascript_programming.html?raw').then(({default: html}) => {
50+
GUI.load(html, () => {
51+
try {
52+
self.initTranspiler();
53+
54+
// Initialize editor with INAV configuration
55+
self.editor = MonacoLoader.initializeMonacoEditor(monaco, 'monaco-editor');
56+
57+
// Add INAV type definitions
58+
MonacoLoader.addINAVTypeDefinitions(monaco);
59+
60+
// Set up linting
61+
MonacoLoader.setupLinting(self.editor, function() {
62+
if (self.lintCode) {
63+
self.lintCode();
64+
}
65+
});
66+
67+
// Continue with initialization
68+
self.setupEventHandlers();
69+
self.loadExamples();
70+
71+
self.loadFromFC(function() {
72+
self.isDirty = false;
73+
GUI.content_ready(callback);
74+
});
75+
} catch (error) {
76+
console.error('Failed to load Monaco Editor:', error);
6777
GUI.content_ready(callback);
68-
});
69-
})
70-
.catch(function(error) {
71-
console.error('Failed to load Monaco Editor:', error);
72-
GUI.content_ready(callback);
73-
});
74-
78+
}
7579

80+
});
7681
});
7782
},
7883

0 commit comments

Comments
 (0)