1年半前のblazorで作ったページを更新した時のメモ

## はじめに

1年半ほど前に作成したブラウザで動く.NETデコンパイラ**[Kani](https://yaegaki.github.io/Kani/)** がChromeで謎のエラーを出して動かなくなってしまいました。  
使用できないと不便だったので最新のblazorに更新することにしました。

https://qiita.com/yaegaki/items/a886423869bfa3bb9826

<details><summary>エラー内容</summary><div>

```
blazor.webassembly.js:1 Uncaught (in promise) Error: System.Text.Json.JsonException: The JSON value could not be converted to System.Int64. Path: $.screenX | LineNumber: 0 | BytePositionInLine: 54.
  at System.Text.Json.ThrowHelper.ThowJsonException (System.String message, System.Text.Json.Utf8JsonReader& reader, System.String path) <0x28f6490 + 0x000d2> in <1464ffed8a7945e3b49126b8d0d72878>:0 
  at System.Text.Json.ThrowHelper.ThrowJsonException_DeserializeUnableToConvertValue (System.Type propertyType, System.Text.Json.Utf8JsonReader& reader, System.String path) <0x28f2b18 + 0x00014> in <1464ffed8a7945e3b49126b8d0d72878>:0 
  at System.Text.Json.Serialization.JsonPropertyInfoNotNullable`3[TClass,TDeclaredProperty,TRuntimeProperty].Read (System.Text.Json.JsonTokenType tokenType, System.Text.Json.Serialization.ReadStack& state, System.Text.Json.Utf8JsonReader& reader) <0x28f1418 + 0x00102> in <1464ffed8a7945e3b49126b8d0d72878>:0 
  at System.Text.Json.Serialization.JsonSerializer.HandleValue (System.Text.Json.JsonTokenType tokenType, System.Text.Json.Serialization.JsonSerializerOptions options, System.Text.Json.Utf8JsonReader& reader, System.Text.Json.Serialization.ReadStack& state) <0x2428350 + 0x000cc> in <1464ffed8a7945e3b49126b8d0d72878>:0 
  at System.Text.Json.Serialization.JsonSerializer.ReadCore (System.Text.Json.Serialization.JsonSerializerOptions options, System.Text.Json.Utf8JsonReader& reader, System.Text.Json.Serialization.ReadStack& readStack) <0x24214f8 + 0x00072> in <1464ffed8a7945e3b49126b8d0d72878>:0 
  at System.Text.Json.Serialization.JsonSerializer.ReadCore (System.Type returnType, System.Text.Json.Serialization.JsonSerializerOptions options, System.Text.Json.Utf8JsonReader& reader) <0x2420918 + 0x0003e> in <1464ffed8a7945e3b49126b8d0d72878>:0 
  at System.Text.Json.Serialization.JsonSerializer.ParseCore (System.String json, System.Type returnType, System.Text.Json.Serialization.JsonSerializerOptions options) <0x24149d8 + 0x00092> in <1464ffed8a7945e3b49126b8d0d72878>:0 
  at System.Text.Json.Serialization.JsonSerializer.Parse[TValue] (System.String json, System.Text.Json.Serialization.JsonSerializerOptions options) <0x28ddd20 + 0x00022> in <1464ffed8a7945e3b49126b8d0d72878>:0 
  at Microsoft.AspNetCore.Components.Browser.RendererRegistryEventDispatcher.Deserialize[T] (System.String eventArgsJson) <0x28ddce0 + 0x0000a> in <7d27b6e2ea514fe78f57339b4fdb2793>:0 
  at Microsoft.AspNetCore.Components.Browser.RendererRegistryEventDispatcher.ParseEventArgsJson (System.String eventArgsType, System.String eventArgsJson) <0x28dd8c0 + 0x00224> in <7d27b6e2ea514fe78f57339b4fdb2793>:0 
  at Microsoft.AspNetCore.Components.Browser.RendererRegistryEventDispatcher.DispatchEvent (Microsoft.AspNetCore.Components.Browser.RendererRegistryEventDispatcher+BrowserEventDescriptor eventDescriptor, System.String eventArgsJson) <0x28dd1d8 + 0x0001a> in <7d27b6e2ea514fe78f57339b4fdb2793>:0 
  at (wrapper managed-to-native) System.Reflection.RuntimeMethodInfo.InternalInvoke(System.Reflection.RuntimeMethodInfo,object,object[],System.Exception&)
  at System.Reflection.RuntimeMethodInfo.Invoke (System.Object obj, System.Reflection.BindingFlags invokeAttr, System.Reflection.Binder binder, System.Object[] parameters, System.Globalization.CultureInfo culture) <0x1fcda90 + 0x000d2> in <868fc6d429434ef6a7d786bf7b405f2f>:0 
--- End of stack trace from previous location where exception was thrown ---
```
</div>
</details>

## バージョン

```sh
$ dotnet --version
5.0.201
```

## 更新ポイント

とりあえず動けばよかったので詳しくは調べず、動くように修正しています。
2021/3/28時点の情報です。

### csproj

Sdkを`Microsoft.NET.Sdk.BlazorWebAssembly`に変更

```diff
-<Project Sdk="Microsoft.NET.Sdk.Web">
+<Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
```

targetなどを変更

```diff
-    <TargetFramework>netstandard2.0</TargetFramework>
-    <LangVersion>7.3</LangVersion>
-    <RazorLangVersion>3.0</RazorLangVersion>
+    <TargetFramework>net5.0</TargetFramework>
```

依存パッケージ変更

```diff
-    <PackageReference Include="Microsoft.AspNetCore.Blazor" Version="3.0.0-preview6.19307.2" />
-    <PackageReference Include="Microsoft.AspNetCore.Blazor.Build" Version="3.0.0-preview6.19307.2" PrivateAssets="all" />
-    <PackageReference Include="Microsoft.AspNetCore.Blazor.DevServer" Version="3.0.0-preview6.19307.2" PrivateAssets="all" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="5.0.4" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="5.0.4" PrivateAssets="all" />
+    <PackageReference Include="System.Net.Http.Json" Version="5.0.0" />
```

### HostBuilder

`BlazorWebAssemblyHost`を`WebAssemblyHostBuilder`に変更
`UseBlazorStartup`が消滅していたので使わない方式に変更

### _Imports

`Microsoft.AspNetCore.Components.Layouts`は消滅したので削除
`Microsoft.AspNetCore.Components.Web`を追加

### Router

`NotFoundContent`が消滅、代わりに`Found`と`NotFound`を追加

### Components

`OnInit`/`OnInitAsync`を`OnInitialized`/`OnInitializedAsync`に変更
`OnAfterRenderAsync`に`bool isFirstRender`の引数を追加
`ElementRef`を`ElementReference`に変更
`UIMouseEventArgs`を`MouseEventArgs`に変更
`Microsoft.AspNetCore.Components.RenderTree`を`Microsoft.AspNetCore.Components.Rendering`に変更

### その他

DLL配置パスを`_framework/bin/XXX.dll`から`_framework/XXX.dll`に変更

## 最後に

廃止になった機能などはほとんどなく大抵は名前の変更だけで動いたので楽に更新することができました。
実際の更新内容は以下のコミットで確認できます。
https://github.com/yaegaki/Kani/commit/d358929ba1b51c488f5b2de09deeabe54e02cd11