[Idea] direct Communication between razor and js

[sajjadarashhh]

if you see dotnet aspnet core issue for creating more developer friendly features in razor language we can create a way to use browser apis directly in .net without using jsInterop directly in razor file and we can create new features and concept to avoiding user invalid names and... for example we have 1 razor component name Counter:

• Counter.razor Counter.razor.cs Counter.razor.jsr in Counter.razor user write Html like tags and attribute for razor page in counter.razor.cs user write c# codes and in Counter.razor.jsr user can write js codes that can called .net modules and in C# class we can call modules existing in this file. for example contents must be like it:

counter.razor:

<div>
          <h1>
              Counter Page.
          </h1>
          <h2>result is : ${Number} </h2>
          <button @onclick="Add"></button>
</div>

Counter.razor.cs:

public partial class Counter{

          public async Task Add(){
                 AddJsModule();
          }

}

Counter.razor.jsr

export Number
export AddJsModule(){

Number+=1;

}

this is very simple way to communicate between js razor and html and user can read and write easier than before

[sajjadarashhh]

in this scenario we can create a jsInterop codes with SourceGenerator at compile time for each items in jsr file for each item exported from that in partial class name Counter :D

[LuohuaRain]

It's a good idea. I think it maybe better with .tsr? Integrating with TypeScript (ts+razor+css)

[sajjadarashhh]

@LuohuaRain Yeah that more like c# and we can use that

[ryzngard]

Not sure I completely follow. Even with a new language, the underlying exposition for marshalling js + dotnet types is always going to be the JSImport and JSExport style workings. Is there some scenario where those are not right? Are you look for more compile time validation of that?

[sajjadarashhh]

Yeah That js export and import can be more easier to use and easier to integrating with dom and js libraries For example that can be difficult to integrating with various js libraries like chat.js and etc... If i wana to use chart.js in my page that i need create container in my page then create js modules in another file in wwwroot then import them in my razor page then call thats here developer might be make mistake in that codes and wirte names invalid or... Then execute page check console logs then back to visual studio check codes then solve problems and boom.... Another problem happen 😂😂 Here we can reducing developer mistakes in compile time and create trusted way for developers their can be sure js modules called true and theirs available and this is very easy to use and their no needed to code for import and export and etc... For here ts can be good choice