MBSelect throws javascript TypeError about material.blazor

[MarkStega]

@BasJ93

I just checked out the M.B 3.3.1 code and ran the demo website. The MBSelect demo page is properly handling labels.

I've cloned your repository and tried to build the 'features/overview' branch and get 35 errors and 26 warnings:

Severity	Code	Description	Project	File	Line	Suppression State
Error	CS0006	Metadata file 'Severity	Code	Description	Project	File	Line	Suppression State
Error	CS0006	Metadata file 'C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web.API.Client\obj\Debug\net6.0\ref\MyFoodLog.Web.API.Client.dll' could not be found	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\CSC	1	Active
Error	CS0518	Predefined type 'System.Void' is not defined or imported	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	35	Active
Error	CS0400	The type or namespace name 'System' could not be found in the global namespace (are you missing an assembly reference?)	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	47	Active
Error	CS0400	The type or namespace name 'System' could not be found in the global namespace (are you missing an assembly reference?)	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	54	Active
Error	CS0518	Predefined type 'System.String' is not defined or imported	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	54	Active
Error	CS0155	The type caught or thrown must be derived from System.Exception	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	58	Active
Error	CS0400	The type or namespace name 'System' could not be found in the global namespace (are you missing an assembly reference?)	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	58	Active
Error	CS0518	Predefined type 'System.Object' is not defined or imported	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	67	Active
Error	CS0518	Predefined type 'System.String' is not defined or imported	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	69	Active
Error	CS0518	Predefined type 'System.String' is not defined or imported	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	69	Active
Error	CS0518	Predefined type 'System.Decimal' is not defined or imported	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	70	Active
Error	CS0518	Predefined type 'System.Decimal' is not defined or imported	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	70	Active
Error	CS0518	Predefined type 'System.Object' is not defined or imported	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	77	Active
Error	CS0518	Predefined type 'System.String' is not defined or imported	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	78	Active
Error	CS0518	Predefined type 'System.String' is not defined or imported	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	81	Active
Error	CS0518	Predefined type 'System.String' is not defined or imported	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	81	Active
Error	CS0518	Predefined type 'System.Nullable`1' is not defined or imported	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	87	Active
Error	CS0246	The type or namespace name 'IDisposable' could not be found (are you missing a using directive or an assembly reference?)	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Program.cs	16	Active
Error	CS0246	The type or namespace name 'HttpClient' could not be found (are you missing a using directive or an assembly reference?)	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Program.cs	16	Active
Error	CS0246	The type or namespace name 'IDisposable' could not be found (are you missing a using directive or an assembly reference?)	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Program.cs	16	Active
Error	CS0518	Predefined type 'System.Object' is not defined or imported	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Program.cs	18	Active
Error (active)	CS1662	Cannot convert lambda expression to intended delegate type because some of the return types in the block are not implicitly convertible to the delegate return type		C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor	3	
Error (active)	CS0518	Predefined type 'System.String' is not defined or imported		C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor	6	
Error (active)	CS0518	Predefined type 'System.String' is not defined or imported		C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor	6	
Error (active)	CS0518	Predefined type 'System.String' is not defined or imported		C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor	6	
Error (active)	CS0518	Predefined type 'System.String' is not defined or imported		C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor	6	
Error (active)	CS0518	Predefined type 'System.Decimal' is not defined or imported		C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor	14	
Error (active)	CS0518	Predefined type 'System.Decimal' is not defined or imported		C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor	14	
Error (active)	CS0518	Predefined type 'System.Decimal' is not defined or imported		C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor	14	
Error (active)	CS0518	Predefined type 'System.Decimal' is not defined or imported		C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor	14	
Error (active)	CS0518	Predefined type 'System.Nullable`1' is not defined or imported		C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor	31	
Error (active)	CS0518	Predefined type 'System.Nullable`1' is not defined or imported		C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor	31	
Error (active)	CS0518	Predefined type 'System.Nullable`1' is not defined or imported		C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor	31	
Error (active)	CS0518	Predefined type 'System.Nullable`1' is not defined or imported		C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor	31	
Warning	CS0108	'FoodConsumptionDto.Id' hides inherited member 'FoodItemDto.Id'. Use the new keyword if hiding was intended.	MyFoodLog.Models	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Models\FoodConsumption\FoodConsumptionDto.cs	7	Active
Warning	CS1998	This async method lacks 'await' operators and will run synchronously. Consider using the 'await' operator to await non-blocking API calls, or 'await Task.Run(...)' to do CPU-bound work on a background thread.	MyFoodLog.ClientApis	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.ClientApis\BaseClients\APIKeyBaseClient.cs	5	Active
Warning	CS8618	Non-nullable property 'VerboseStatus' must contain a non-null value when exiting constructor. Consider declaring the property as nullable.	MyFoodLog.ClientApis	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.ClientApis\Models\OpenFoodFacts\BarcodeResponse.cs	14	Active
Warning	CS1998	This async method lacks 'await' operators and will run synchronously. Consider using the 'await' operator to await non-blocking API calls, or 'await Task.Run(...)' to do CPU-bound work on a background thread.	MyFoodLog.Database	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Database\Repositories\GenericCrudRepository.cs	65	Active
Warning	CS1998	This async method lacks 'await' operators and will run synchronously. Consider using the 'await' operator to await non-blocking API calls, or 'await Task.Run(...)' to do CPU-bound work on a background thread.	MyFoodLog.Database	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Database\Repositories\GenericCrudRepository.cs	115	Active
Warning	CS8629	Nullable value type may be null.	MyFoodLog.Database	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Database\Repositories\MealTypeRepository.cs	19	Active
Warning	CS8629	Nullable value type may be null.	MyFoodLog.Database	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Database\Repositories\MealTypeRepository.cs	20	Active
Warning	CS8618	Non-nullable property 'Name' must contain a non-null value when exiting constructor. Consider declaring the property as nullable.	MyFoodLog.Models	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Models\MealTypes\CreateMealTypeDto.cs	8	Active
Warning	CS8602	Dereference of a possibly null reference.	MyFoodLog.Core	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Core\AutoMapper\Profiles.cs	19	Active
Warning	CS8602	Dereference of a possibly null reference.	MyFoodLog.Core	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Core\AutoMapper\Profiles.cs	21	Active
Warning	CS8602	Dereference of a possibly null reference.	MyFoodLog.Core	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Core\AutoMapper\Profiles.cs	22	Active
Warning	CS8602	Dereference of a possibly null reference.	MyFoodLog.Core	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Core\AutoMapper\Profiles.cs	23	Active
Warning	CS8602	Dereference of a possibly null reference.	MyFoodLog.Core	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Core\AutoMapper\Profiles.cs	24	Active
Warning	CS8602	Dereference of a possibly null reference.	MyFoodLog.Core	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Core\AutoMapper\Profiles.cs	25	Active
Warning	CS8602	Dereference of a possibly null reference.	MyFoodLog.Core	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Core\AutoMapper\Profiles.cs	26	Active
Warning	CS1998	This async method lacks 'await' operators and will run synchronously. Consider using the 'await' operator to await non-blocking API calls, or 'await Task.Run(...)' to do CPU-bound work on a background thread.	MyFoodLog.Core	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Core\Services\FoodItemService.cs	63	Active
Warning	CS8604	Possible null reference argument for parameter 'source' in 'decimal Enumerable.Sum<FoodConsumptionDto>(IEnumerable<FoodConsumptionDto> source, Func<FoodConsumptionDto, decimal> selector)'.	MyFoodLog.Core	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Core\Services\MealService.cs	59	Active
Warning	CS8602	Dereference of a possibly null reference.	MyFoodLog.Core	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Core\Services\MealService.cs	67	Active
Warning	CS8602	Dereference of a possibly null reference.	MyFoodLog.Core	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Core\Services\MealService.cs	68	Active
Warning	CS8602	Dereference of a possibly null reference.	MyFoodLog.Core	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Core\Services\MealService.cs	69	Active
Warning	CS1591	Missing XML comment for publicly visible type or member 'BarcodeController'	MyFoodLog.API	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.API\Controllers\BarcodeController.cs	11	Active
Warning	CS1591	Missing XML comment for publicly visible type or member 'BarcodeController.SearchForBarcode(string, CancellationToken)'	MyFoodLog.API	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.API\Controllers\BarcodeController.cs	27	Active
Warning	CS1591	Missing XML comment for publicly visible type or member 'MealController.Delete(Guid, CancellationToken)'	MyFoodLog.API	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.API\Controllers\MealController.cs	43	Active
Warning	CS8602	Dereference of a possibly null reference.	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	81	Active
Warning	CS8602	Dereference of a possibly null reference.	MyFoodLog.Web	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web\Components\FoodConsumptionComponent.razor.cs	81	Active
Error	MSB3073	The command "dotnet "C:\Users\ms\.nuget\packages\nswag.msbuild\13.19.0\buildTransitive\../tools/Net60/dotnet-nswag.dll" openapi2csclient /input:http://localhost:5081/swagger/v1/swagger.json /classname:MyFoodLogApi /namespace:MyFoodLog.Web.API.Client /GenerateClientInterfaces:true /InjectHttpClient:true /UseHttpClientCreationMethod:false /GenerateClientClasses:true /output:MyFoodLogClient.g.cs /contractsoutput:Interfaces/IMyFoodLogClient.g.cs /GenerateContractsOutput:true /ContractsNamespace:MyFoodLog.Web.API.Client.Interfaces /excludedTypeNames:ExposedEntity_IncludingUserEntities_NotIncludingNotEditable /OperationGenerationMode:SingleClientFromOperationId /HttpClientType:MyFoodLog.Web.API.Client.Interfaces.ICustomHttpClient" exited with code -1.	MyFoodLog.Web.API.Client	C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web.API.Client\MyFoodLog.Web.API.Client.csproj	20	
Warning	RAZORSDK1007	Reference assembly C:\Solutions\TemporarySolutions\MyFoodLog\MyFoodLog.Web.API.Client\bin\Debug\net6.0\MyFoodLog.Web.API.Client.dll could not be found. This is typically caused by build errors in referenced projects.	MyFoodLog.Web	C:\Program Files\dotnet\sdk\8.0.100-preview.4.23260.5\Sdks\Microsoft.NET.Sdk.Razor\targets\Microsoft.NET.Sdk.Razor.MvcApplicationPartsDiscovery.targets	54	

Guidance requested!

[MarkStega]

@BasJ93

I think you need to create a new branch & greatly chop down on the project that focuses on demonstrating the problem.

I did notice one oddity in that the 'MyFoodLog.Web.API.Client' project includes a source file MyFoodLogClient.g.cs which is a generated file. That's a very odd practice. I'd like to understand what you are trying to do there.

[BasJ93]

@MarkStega, sorry I couldn't get to responding to this yet. The idea behind including the generated code (which is generated by NSwag for an OpenAPI spec of the backend api) is that it does not need to be generated during build. The branch was not intended as a pure example, though I will try to produce that, as it was a bug I ran in to during development and just kept the branch at the state where the bug showed up.

I should also fix up some of the errors you have shown in the other reply, as the main failure there is the fact that NSwag could not generate the client code (MyFoodLogClient.g.cs) due to the fact that it was expecting a running API.

I will update this issue when I've had time to clean it up for you.

[MarkStega]

@BasJ93

I was talking to Simon Z today and I brought up another possibility for the error. Material.Blazor depends upon components not modifying the DOM. We allow Blazor to initialize a component and then 'step out of the way' and all animations, etc. that you see are being controlled by Material Design javascript. If ChartJS is modifying the DOM it likely won't work with Material.Blazor.

Simon uses something called AMChart in his product. It has access to an empty div and only modifies that div. Blazor & Material Design have no idea that the div is getting modified and nothing else in the dom changes so both are happy.

One thing to try (after that longwinded windup would be to create another branch an comment all of the ChartJS/BlazorChartJS out of the code.

[BasJ93]

@MarkStega I'm not opposed to trying that, but to me that feels off as the part of the app where I observed the behavior is no where near the ChartJS stuff.

The only thing modifying the DOM anywhere near the dropdown is the API call loading the options in to the dropdown, which only modifies the collection backing the MBSelect.

I'll work on condensing my example, to see if I can still reproduce the bug.

[BasJ93]

@MarkStega Very weird, but I can no longer reproduce the behavior. Therefore I'm going to close this issue, and assume it was a mistake I made somewhere that I accidentally fixed.