Adds "use latest dev" button

website/src/website/pages/playground/PlaygroundModel.ts

@@ -404,6 +404,16 @@ class StateUrlSerializer implements IHistoryModel {
 		this.historyId++;
 	}
 
+	@action
+	useLatestDev(): void {
+		this._sourceOverride = undefined;
+		this.model.settings.setSettings({
+			...this.model.settings.settings,
+			...Source.useLatestDev().toPartialSettings(),
+		});
+		this.historyId++;
+	}
+
 	@action
 	saveSourceOverride(): void {
 		if (this._sourceOverride) {
@@ -662,22 +672,26 @@ function findLastIndex<T>(
 }
 
 class Source {
+	public static useLatestDev(sourceLanguagesStr?: string): Source {
+		// Assume the versions are already loaded
+		const versions = getNpmVersionsSync(undefined);
+		const version = versions.find((v) => v.indexOf("-dev-") !== -1);
+		return new Source(version, undefined, sourceLanguagesStr);
+	}
+
+	public static useLatest(sourceLanguagesStr?: string): Source {
+		return new Source(monacoEditorVersion, undefined, sourceLanguagesStr);
+	}
+
 	public static parse(
 		sourceStr: string | undefined,
 		sourceLanguagesStr: string | undefined
 	): Source {
 		if (sourceStr === "latest-dev") {
-			// The versions are already loaded
+			return Source.useLatestDev(sourceLanguagesStr);
-			const versions = getNpmVersionsSync(undefined);
-			const version = versions.find((v) => v.indexOf("-dev-") !== -1);
-			return new Source(version, undefined, sourceLanguagesStr);
 		}
 		if (sourceStr === "latest") {
-			return new Source(
+			return Source.useLatest(sourceLanguagesStr);
-				monacoEditorVersion,
-				undefined,
-				sourceLanguagesStr
-			);
 		}
 
 		if (sourceStr && sourceStr.startsWith("v")) {

website/src/website/pages/playground/PlaygroundPageContent.tsx

@@ -192,6 +192,15 @@ export class PlaygroundPageContent extends React.Component<
 														.version ?? "url"}{" "}
 													override
 												</button>
+												<button
+													type="button"
+													className="btn btn-secondary"
+													onClick={() =>
+														model.serializer.useLatestDev()
+													}
+												>
+													Use latest dev
+												</button>
 												<button
 													type="button"
 													className="btn btn-secondary"

website/src/website/pages/playground/getNpmVersionsSync.ts

@@ -20,6 +20,8 @@ export async function getNpmVersions(): Promise<string[]> {
 	return npmVersionsPromise!;
 }
 
+getNpmVersions();
+
 async function loadNpmVersions(): Promise<string[]> {
 	if (npmVersionsPromise === undefined) {
 		npmVersionsPromise = _getNpmVersions();