Skip to content
This repository has been archived by the owner on Mar 22, 2024. It is now read-only.

Commit

Permalink
Implemented review comments and updated dependencies
Browse files Browse the repository at this point in the history
  • Loading branch information
@kaisalmen
kaisalmen committed Nov 24, 2023
1 parent 4022bdd commit 43bd86d
Show file tree
Hide file tree
Showing 15 changed files with 833 additions and 210 deletions.
931 changes: 767 additions & 164 deletions package-lock.json
View file

Large diffs are not rendered by default.

14 changes: 7 additions & 7 deletions package.json
View file
Expand Up @@ -17,20 +17,20 @@
"start:example:server:python": "npm run start:server:python --workspace packages/examples"
},
"devDependencies": {
"@types/node": "~18.18.9",
"@types/node": "~18.18.13",
"@types/shelljs": "~0.8.15",
"@types/vscode": "~1.83.3",
"@typescript-eslint/eslint-plugin": "~6.10.0",
"@typescript-eslint/parser": "~6.10.0",
"@typescript-eslint/eslint-plugin": "~6.12.0",
"@typescript-eslint/parser": "~6.12.0",
"@vitest/browser": "~0.34.6",
"editorconfig": "~2.0.0",
"eslint": "~8.53.0",
"eslint": "~8.54.0",
"shelljs": "~0.8.5",
"shx": "~0.3.4",
"typescript": "~5.2.2",
"vite": "~4.5.0",
"typescript": "~5.3.2",
"vite": "~5.0.2",
"vitest": "~0.34.6",
"webdriverio": "~8.22.0"
"webdriverio": "~8.24.1"
},
"overrides": {
"monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.7 <1.84.0",
Expand Down
12 changes: 6 additions & 6 deletions packages/examples/package.json
View file
@@ -1,21 +1,21 @@
{
"name": "monaco-editor-wrapper-examples",
"private": true,
"version": "3.4.0-next.6",
"version": "3.4.0-next.7",
"type": "module",
"dependencies": {
"@codingame/monaco-vscode-configuration-service-override": "~1.83.7",
"@codingame/monaco-vscode-editor-service-override": "~1.83.7",
"@codingame/monaco-vscode-json-default-extension": "~1.83.7",
"@codingame/monaco-vscode-keybindings-service-override": "~1.83.7",
"@codingame/monaco-vscode-python-default-extension": "~1.83.7",
"@typefox/monaco-editor-react": "~2.4.0-next.6",
"@typefox/monaco-editor-react": "~2.4.0-next.7",
"http-server": "~14.1.1",
"langium": "~2.1.1",
"langium": "~2.1.3",
"langium-statemachine-dsl": "~2.1.0",
"monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.7 <1.84.0",
"monaco-editor-workers": "~0.44.0",
"monaco-editor-wrapper": "~3.4.0-next.6",
"monaco-editor-wrapper": "~3.4.0-next.7",
"monaco-languageclient": "~7.0.2",
"monaco-languageclient-examples": "~7.0.2",
"react": "~18.2.0",
Expand All @@ -28,8 +28,8 @@
"vscode-json-languageservice": "~5.3.7"
},
"devDependencies": {
"@types/react": "~18.2.37",
"@types/react-dom": "~18.2.15",
"@types/react": "~18.2.38",
"@types/react-dom": "~18.2.17",
"ts-node": "~10.9.1"
},
"overrides": {
Expand Down
2 changes: 1 addition & 1 deletion packages/examples/src/common.ts
View file
Expand Up @@ -39,7 +39,7 @@ export const disposeEditor = async (useDiffEditor: boolean) => {

const restartEditor = async (userConfig: UserConfig, htmlElement: HTMLElement | null) => {
await wrapper.dispose();
await wrapper.start(userConfig, htmlElement);
await wrapper.initAndStart(userConfig, htmlElement);
logEditorInfo(userConfig);
};

Expand Down
4 changes: 2 additions & 2 deletions packages/examples/src/langium/wrapperLangium.ts
View file
Expand Up @@ -32,7 +32,7 @@ export const startLangiumClientExtended = async () => {
disableButton('button-start-extended', true);
const config = await setupLangiumClientExtended();
wrapper = new MonacoEditorLanguageClientWrapper();
wrapper.start(config, htmlElement);
wrapper.initAndStart(config, htmlElement);
} catch (e) {
console.log(e);
}
Expand All @@ -45,7 +45,7 @@ export const startLangiumClientClassic = async () => {
disableButton('button-start-extended', true);
const config = await setupLangiumClientClassic();
wrapper = new MonacoEditorLanguageClientWrapper();
await wrapper.start(config, htmlElement!);
await wrapper.initAndStart(config, htmlElement!);
} catch (e) {
console.log(e);
}
Expand Down
4 changes: 2 additions & 2 deletions packages/examples/src/langium/wrapperStatemachine.ts
View file
Expand Up @@ -14,9 +14,9 @@ const startEditor = async () => {
return;
}
const langiumGlobalConfig = await createLangiumGlobalConfig();
await wrapper.start(langiumGlobalConfig, document.getElementById('monaco-editor-root'));
await wrapper.initAndStart(langiumGlobalConfig, document.getElementById('monaco-editor-root'));
const langiumGlobalConfig2 = await createLangiumGlobalConfig();
await wrapper2.start(langiumGlobalConfig2, document.getElementById('monaco-editor-root2'));
await wrapper2.initAndStart(langiumGlobalConfig2, document.getElementById('monaco-editor-root2'));

vscode.commands.getCommands().then((x) => {
console.log('Currently registered # of vscode commands: ' + x.length);
Expand Down
12 changes: 6 additions & 6 deletions packages/examples/src/wrapperAdvanced.ts
View file
Expand Up @@ -97,16 +97,16 @@ const wrapper44Config: UserConfig = {
};

const startWrapper42 = async () => {
await wrapper42.start(wrapper42Config, document.getElementById('monaco-editor-root-42'));
await wrapper42.initAndStart(wrapper42Config, document.getElementById('monaco-editor-root-42'));
console.log('wrapper42 was started.');
};

const startWrapper43 = async () => {
await wrapper43.start(wrapper43Config, document.getElementById('monaco-editor-root-43'));
await wrapper43.initAndStart(wrapper43Config, document.getElementById('monaco-editor-root-43'));
console.log('wrapper43 was started.');
};
const startWrapper44 = async () => {
await wrapper44.start(wrapper44Config, document.getElementById('monaco-editor-root-44'));
await wrapper44.initAndStart(wrapper44Config, document.getElementById('monaco-editor-root-44'));
console.log('wrapper44 was started.');

};
Expand All @@ -123,7 +123,7 @@ const sleepOne = (milliseconds: number) => {
appConfig42.code = `function logMe() {
console.log('Hello swap editors!');
};`;
const w42Start = wrapper42.start(wrapper42Config, document.getElementById('monaco-editor-root-42'));
const w42Start = wrapper42.initAndStart(wrapper42Config, document.getElementById('monaco-editor-root-42'));

const w43Start = wrapper43.updateDiffModel({
languageId: 'javascript',
Expand All @@ -140,7 +140,7 @@ const sleepOne = (milliseconds: number) => {
// This affects all editors globally and is only effective
// if it is not in contrast to one configured later
appConfig44.theme = 'vs-light';
const w44Start = wrapper44.start(wrapper44Config, document.getElementById('monaco-editor-root-44'));
const w44Start = wrapper44.initAndStart(wrapper44Config, document.getElementById('monaco-editor-root-44'));

await w42Start;
console.log('Restarted wrapper42.');
Expand All @@ -159,7 +159,7 @@ const sleepTwo = (milliseconds: number) => {
const appConfig44 = wrapper44Config.wrapperConfig.editorAppConfig as EditorAppConfigClassic;
appConfig44.useDiffEditor = false;
appConfig44.theme = 'vs-dark';
await wrapper44.start(wrapper44Config, document.getElementById('monaco-editor-root-44'));
await wrapper44.initAndStart(wrapper44Config, document.getElementById('monaco-editor-root-44'));
console.log('Restarted wrapper44.');
}, milliseconds);
};
Expand Down
2 changes: 1 addition & 1 deletion packages/examples/vite.bundle-mew.ts
View file
Expand Up @@ -16,11 +16,11 @@ const config = defineConfig({
commonjsOptions: {
strictRequires: true
},
sourcemap: true,
rollupOptions: {
output: {
name: 'mew',
exports: 'named',
sourcemap: true,
assetFileNames: (assetInfo) => {
return `assets/${assetInfo.name}`;
}
Expand Down
8 changes: 4 additions & 4 deletions packages/monaco-editor-react/package.json
View file
@@ -1,6 +1,6 @@
{
"name": "@typefox/monaco-editor-react",
"version": "2.4.0-next.6",
"version": "2.4.0-next.7",
"license": "MIT",
"description": "React component for Monaco-Editor and Monaco Languageclient",
"keywords": [
Expand Down Expand Up @@ -51,15 +51,15 @@
},
"dependencies": {
"monaco-editor": "npm:@codingame/monaco-editor-treemended@>=1.83.7 <1.84.0",
"monaco-editor-wrapper": "~3.4.0-next.6",
"monaco-editor-wrapper": "~3.4.0-next.7",
"react": "~18.2.0",
"vscode": "npm:@codingame/monaco-vscode-api@>=1.83.7 <1.84.0"
},
"peerDependencies": {
"monaco-editor-wrapper": "~3.4.0-next.6"
"monaco-editor-wrapper": "~3.4.0-next.7"
},
"devDependencies": {
"@types/react": "~18.2.37"
"@types/react": "~18.2.38"
},
"overrides": {
"monaco-editor": "$monaco-editor",
Expand Down
12 changes: 6 additions & 6 deletions packages/monaco-editor-react/src/index.tsx
View file
Expand Up @@ -16,7 +16,7 @@ export class MonacoEditorReactComp<T extends MonacoEditorProps = MonacoEditorPro
private wrapper: MonacoEditorLanguageClientWrapper = new MonacoEditorLanguageClientWrapper();
private containerElement?: HTMLDivElement;
private _subscription: IDisposable | null = null;
private isRestaring?: Promise<void>;
private isRestarting?: Promise<void>;
private started: (value: void | PromiseLike<void>) => void;

constructor(props: T) {
Expand Down Expand Up @@ -104,8 +104,8 @@ export class MonacoEditorReactComp<T extends MonacoEditorProps = MonacoEditorPro

protected async destroyMonaco(): Promise<void> {
if (this.wrapper) {
if (this.isRestaring) {
await this.isRestaring;
if (this.isRestarting) {
await this.isRestarting;
}
try {
await this.wrapper.dispose();
Expand All @@ -125,7 +125,7 @@ export class MonacoEditorReactComp<T extends MonacoEditorProps = MonacoEditorPro
} = this.props;

// block "destroyMonaco" until start is complete
this.isRestaring = new Promise<void>((resolve) => {
this.isRestarting = new Promise<void>((resolve) => {
this.started = resolve;
});
await this.wrapper.init(userConfig);
Expand All @@ -140,9 +140,9 @@ export class MonacoEditorReactComp<T extends MonacoEditorProps = MonacoEditorPro
if (this.containerElement) {
this.containerElement.className = className ?? '';

await this.wrapper.startNoInit(this.containerElement);
await this.wrapper.noInitJustStart(this.containerElement);
this.started();
this.isRestaring = undefined;
this.isRestarting = undefined;

// once awaiting isStarting is done onLoad is called if available
onLoad?.();
Expand Down
2 changes: 1 addition & 1 deletion packages/monaco-editor-wrapper/package.json
View file
@@ -1,6 +1,6 @@
{
"name": "monaco-editor-wrapper",
"version": "3.4.0-next.6",
"version": "3.4.0-next.7",
"license": "MIT",
"description": "Monaco-Editor and Monaco Languageclient Wrapper",
"keywords": [
Expand Down
5 changes: 5 additions & 0 deletions packages/monaco-editor-wrapper/src/editorAppBase.ts
View file
Expand Up @@ -267,6 +267,11 @@ export const isModelUpdateRequired = (config: EditorAppConfigBase, modelUpdate:
return updateRequired ? ModelUpdateType.MODEL : codeUpdate;
};

/**
* The check for equality relies on JSON.stringify for instances of type Object.
* Everything else is directly compared.
* In this context, the check for equality is sufficient.
*/
export const isEqual = (obj1: unknown, obj2: unknown) => {
if (obj1 instanceof Object && obj2 instanceof Object) {
return JSON.stringify(obj1) === JSON.stringify(obj2);
Expand Down
23 changes: 19 additions & 4 deletions packages/monaco-editor-wrapper/src/wrapper.ts
View file
Expand Up @@ -34,6 +34,9 @@ export class MonacoEditorLanguageClientWrapper {
private logger: Logger;
private initDone = false;

/**
* Perform an isolated initialization of the user services and the languageclient wrapper (if used).
*/
async init(userConfig: UserConfig) {
if (this.initDone) {
throw new Error('init was already performed. Please call dispose first if you want to re-start.');
Expand Down Expand Up @@ -64,6 +67,9 @@ export class MonacoEditorLanguageClientWrapper {
this.initDone = true;
}

/**
* Child classes are allow to override the services configuration implementation.
*/
protected configureServices() {
// always set required services if not configured
this.serviceConfig.userServices = this.serviceConfig.userServices ?? {};
Expand All @@ -81,14 +87,20 @@ export class MonacoEditorLanguageClientWrapper {
this.serviceConfig.debugLogging = this.logger.isEnabled() && (this.serviceConfig.debugLogging || this.logger.isDebugEnabled());
}

async start(userConfig: UserConfig, htmlElement: HTMLElement | null) {
/**
* Performs a full user configuration and the languageclient wrapper (if used) init and then start the application.
*/
async initAndStart(userConfig: UserConfig, htmlElement: HTMLElement | null) {
await this.init(userConfig);
await this.startNoInit(htmlElement);
await this.noInitJustStart(htmlElement);
}

async startNoInit(htmlElement: HTMLElement | null) {
/**
* Does not perform any user configuration or other application init and just starts the application.
*/
async noInitJustStart(htmlElement: HTMLElement | null) {
if (!this.initDone) {
throw new Error('No init was performed. Please call init() before startNoInit()');
throw new Error('No init was performed. Please call init() before noInitJustStart()');
}
if (!htmlElement) {
throw new Error('No HTMLElement provided for monaco-editor.');
Expand Down Expand Up @@ -155,6 +167,9 @@ export class MonacoEditorLanguageClientWrapper {
return status;
}

/**
* Disposes all application and editor resources, plus the languageclient (if used).
*/
async dispose(): Promise<void> {
this.editorApp?.disposeApp();

Expand Down
10 changes: 5 additions & 5 deletions packages/monaco-editor-wrapper/test/wrapper.test.ts
View file
Expand Up @@ -20,7 +20,7 @@ describe('Test MonacoEditorLanguageClientWrapper', () => {
test('Check default values', async () => {
createMonacoEditorDiv();
const wrapper = new MonacoEditorLanguageClientWrapper();
await wrapper.start(createBaseConfig('classic'), document.getElementById('monaco-editor-root'));
await wrapper.initAndStart(createBaseConfig('classic'), document.getElementById('monaco-editor-root'));

const app = wrapper.getMonacoEditorApp() as EditorAppClassic;
expect(app).toBeDefined();
Expand All @@ -34,16 +34,16 @@ describe('Test MonacoEditorLanguageClientWrapper', () => {
createMonacoEditorDiv();
const wrapper = new MonacoEditorLanguageClientWrapper();
await expect(async () => {
await wrapper.start(createBaseConfig('classic'), null);
await wrapper.initAndStart(createBaseConfig('classic'), null);
}).rejects.toThrowError('No HTMLElement provided for monaco-editor.');
});

test('Expected throw: Start without init', async () => {
createMonacoEditorDiv();
const wrapper = new MonacoEditorLanguageClientWrapper();
await expect(async () => {
await wrapper.startNoInit(document.getElementById('monaco-editor-root'));
}).rejects.toThrowError('No init was performed. Please call init() before startNoInit()');
await wrapper.noInitJustStart(document.getElementById('monaco-editor-root'));
}).rejects.toThrowError('No init was performed. Please call init() before noInitJustStart()');
});

test('Expected throw: Call normal start with prior init', async () => {
Expand All @@ -52,7 +52,7 @@ describe('Test MonacoEditorLanguageClientWrapper', () => {
await expect(async () => {
const config = createBaseConfig('classic');
await wrapper.init(config);
await wrapper.start(config, document.getElementById('monaco-editor-root'));
await wrapper.initAndStart(config, document.getElementById('monaco-editor-root'));
}).rejects.toThrowError('init was already performed. Please call dispose first if you want to re-start.');
});
});
2 changes: 1 addition & 1 deletion packages/monaco-editor-wrapper/vite.bundle.config.ts
View file
Expand Up @@ -13,11 +13,11 @@ export default defineConfig({
assetsDir: 'bundle/assets',
emptyOutDir: true,
cssCodeSplit: false,
sourcemap: true,
rollupOptions: {
output: {
name: 'monaco-editor-wrapper',
exports: 'named',
sourcemap: true,
assetFileNames: (assetInfo) => {
return `assets/${assetInfo.name}`;
}
Expand Down

0 comments on commit 43bd86d

Please sign in to comment.