diff --git a/types/blazor__javascript-interop/blazor__javascript-interop-tests.ts b/types/blazor__javascript-interop/blazor__javascript-interop-tests.ts
new file mode 100644
index 0000000000..b3aad9d652
--- /dev/null
+++ b/types/blazor__javascript-interop/blazor__javascript-interop-tests.ts
@@ -0,0 +1,47 @@
+///
+//
+// see {@link https://docs.microsoft.com/en-us/aspnet/core/blazor/javascript-interop?view=aspnetcore-3.1}
+//
+const exampleJsFunctions = {
+ showPrompt(text: string | undefined) {
+ return prompt(text, 'Type your name here');
+ },
+ displayWelcome(welcomeMessage: string) {
+ document.getElementById('welcome')!.innerText = welcomeMessage;
+ },
+ returnArrayAsyncJs() {
+ DotNet.invokeMethodAsync('BlazorSample', 'ReturnArrayAsync').then(data => {
+ data.push(4);
+ console.log(data);
+ });
+ },
+ sayHello(dotnetHelper: DotNet.DotNetObject) {
+ return dotnetHelper.invokeMethodAsync('SayHello').then(r => console.log(r));
+ },
+};
+
+interface ColorFlags {
+ red: boolean;
+ green: boolean;
+ blue: boolean;
+}
+
+const testInteropApi = async (dotNetRef: DotNet.DotNetObject) => {
+ // validate api patterns
+ const tokens = [1, 2, 3];
+ DotNet.invokeMethod('MyCoolApp.Core', 'Foo', 'First', 'Second'); // $ExpectType string
+ DotNet.invokeMethod('MyCoolApp.Core', 'Foo', 1, 2); // $ExpectType number
+ const fooResults = await DotNet.invokeMethodAsync('MyCoolApp.Core', 'Foo', 'First', 'Second'); // $ExpectType string
+ DotNet.invokeMethodAsync('MyCoolApp.Core', 'Foo', 'First', 'Second'); // $ExpectType Promise
+ DotNet.invokeMethodAsync('MyCoolApp.Core', 'Foo', 'First', 'Second'); // $ExpectType Promise
+ DotNet.invokeMethodAsync('MyCoolApp.Core', 'Foo', ...tokens); // $ExpectType Promise
+ DotNet.invokeMethodAsync('MyCoolApp.Core', 'Foo', 5, ...tokens, 20, ...[25]); // $ExpectType Promise
+ DotNet.invokeMethodAsync('MyCoolApp.Core', 'Foo', 1, 2, 3); // $ExpectType Promise
+ dotNetRef.invokeMethod('MyCoolApp.Core', 'Foo', 'First', 'Second'); // $ExpectType string
+ dotNetRef.invokeMethod('MyCoolApp.Core', 'Foo', 1, 2); // $ExpectType number
+ const fooResults2 = await dotNetRef.invokeMethodAsync('MyCoolApp.Core', 'Foo', 'First', 'Second'); // $ExpectType string
+ dotNetRef.invokeMethodAsync('MyCoolApp.Core', 'Foo', 'First', 'Second'); // $ExpectType Promise
+ dotNetRef.invokeMethodAsync('MyCoolApp.Core', 'Foo', ...tokens); // $ExpectType Promise
+ dotNetRef.invokeMethodAsync('MyCoolApp.Core', 'Foo', 5, ...tokens, 20, ...[25]); // $ExpectType Promise
+ dotNetRef.invokeMethodAsync('MyCoolApp.Core', 'Foo', 1, 2, 3); // $ExpectType Promise
+};
diff --git a/types/blazor__javascript-interop/index.d.ts b/types/blazor__javascript-interop/index.d.ts
new file mode 100644
index 0000000000..dc5d42dfaa
--- /dev/null
+++ b/types/blazor__javascript-interop/index.d.ts
@@ -0,0 +1,56 @@
+// Type definitions for non-npm package blazor__javascript-interop 3.1
+// Project: https://docs.microsoft.com/en-us/aspnet/core/blazor/javascript-interop?view=aspnetcore-3.1
+// Definitions by: Piotr Błażejewicz (Peter Blazejewicz)
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+// Minimum TypeScript Version: 3.0
+
+// Here be dragons!
+// This is community-maintained definition file intended to ease the process of developing
+// high quality JavaScript interop code to be used in Blazor application from your C# .Net code.
+// Could be removed without a notice in case official definition types ships with Blazor itself.
+
+// tslint:disable:no-unnecessary-generics
+
+declare namespace DotNet {
+ /**
+ * Invokes the specified .NET public method synchronously. Not all hosting scenarios support
+ * synchronous invocation, so if possible use invokeMethodAsync instead.
+ *
+ * @param assemblyName The short name (without key/version or .dll extension) of the .NET assembly containing the method.
+ * @param methodIdentifier The identifier of the method to invoke. The method must have a [JSInvokable] attribute specifying this identifier.
+ * @param args Arguments to pass to the method, each of which must be JSON-serializable.
+ * @returns The result of the operation.
+ */
+ function invokeMethod(assemblyName: string, methodIdentifier: string, ...args: any[]): T;
+ /**
+ * Invokes the specified .NET public method asynchronously.
+ *
+ * @param assemblyName The short name (without key/version or .dll extension) of the .NET assembly containing the method.
+ * @param methodIdentifier The identifier of the method to invoke. The method must have a [JSInvokable] attribute specifying this identifier.
+ * @param args Arguments to pass to the method, each of which must be JSON-serializable.
+ * @returns A promise representing the result of the operation.
+ */
+ function invokeMethodAsync(assemblyName: string, methodIdentifier: string, ...args: any[]): Promise;
+ /**
+ * Represents the .NET instance passed by reference to JavaScript.
+ */
+ interface DotNetObject {
+ /**
+ * Invokes the specified .NET instance public method synchronously. Not all hosting scenarios support
+ * synchronous invocation, so if possible use invokeMethodAsync instead.
+ *
+ * @param methodIdentifier The identifier of the method to invoke. The method must have a [JSInvokable] attribute specifying this identifier.
+ * @param args Arguments to pass to the method, each of which must be JSON-serializable.
+ * @returns The result of the operation.
+ */
+ invokeMethod(methodIdentifier: string, ...args: any[]): T;
+ /**
+ * Invokes the specified .NET instance public method asynchronously.
+ *
+ * @param methodIdentifier The identifier of the method to invoke. The method must have a [JSInvokable] attribute specifying this identifier.
+ * @param args Arguments to pass to the method, each of which must be JSON-serializable.
+ * @returns A promise representing the result of the operation.
+ */
+ invokeMethodAsync(methodIdentifier: string, ...args: any[]): Promise;
+ }
+}
diff --git a/types/blazor__javascript-interop/tsconfig.json b/types/blazor__javascript-interop/tsconfig.json
new file mode 100644
index 0000000000..5ce184b127
--- /dev/null
+++ b/types/blazor__javascript-interop/tsconfig.json
@@ -0,0 +1,26 @@
+{
+ "compilerOptions": {
+ "module": "commonjs",
+ "lib": [
+ "es6"
+ ],
+ "noImplicitAny": true,
+ "noImplicitThis": true,
+ "strictFunctionTypes": true,
+ "strictNullChecks": true,
+ "baseUrl": "../",
+ "typeRoots": [
+ "../"
+ ],
+ "paths":{
+ "@blazor/javascript-interop": ["blazor__javascript-interop"]
+ },
+ "types": [],
+ "noEmit": true,
+ "forceConsistentCasingInFileNames": true
+ },
+ "files": [
+ "index.d.ts",
+ "blazor__javascript-interop-tests.ts"
+ ]
+}
diff --git a/types/blazor__javascript-interop/tslint.json b/types/blazor__javascript-interop/tslint.json
new file mode 100644
index 0000000000..3db14f85ea
--- /dev/null
+++ b/types/blazor__javascript-interop/tslint.json
@@ -0,0 +1 @@
+{ "extends": "dtslint/dt.json" }