link crossorigin property must be camelCased

[mdevol58]

Please check that your issue is not already in the errata aka list of corrections and improvements. Please note that PRs will be ignored because code in the repo must match the print book already published. Please raise an issue instead so I can handle it appropriately. All issues will be entered into the errata once closed and fixed in the next book edition.

Chapter: 16
Page Number: 578
Section Title: Building Blazor components
Problem to fix: While troubleshooting why the Delete Database dialog box wouldn't open, I found an error message in the Developer Tools Console tab that contained the following - "... resource requires the request to be CORS enabled to check the integrity ...". Searching for this I found a post on StackOverflow stating that this is most likely caused by the crossOrigin property in the link element not properly camelCased. Once I corrected the links for bootstrap.min.css and bootstrap.min.js, the Delete Database dialog box started working properly.
Suggested solution: In step 17, fix the crossorigin property in the 2 new link elements so that it is crossOrigin.
Other useful information e.g. OS, coding tools, and so on:

[markjprice]

What browser and OS are you using? I've tested the code with Chrome and Edge and Firefox and none complain about the crossorigin attribute. Official documentation uses crossorigin. So does the Bootstrap template that I copied the link from.
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/crossorigin

[markjprice]

Do you remember the stackoverflow article you read about it? Is it this one? https://stackoverflow.com/questions/69377275/typescript-font-import-error-with-link-tag-property-crossorigin
If so, note it has been closed as not reproducible and anyway seems to only apply to JSX/React.

[markjprice]

Or was it this one?
https://stackoverflow.com/questions/35323268/how-to-solve-resource-requires-the-request-to-be-cors-enabled-resource-has-bee

[mdevol58]

Yes it was this one. After I made this change everything started working. When I was writing up this issue, I undid the change so that I could get the full error message, but, I could never reproduce the problem again. I even tried clearing my cache for the last 24 hours, but still can’t reproduce the problem. So, bottom line, I can no longer reproduce it once it started working. From: Mark J. Price ***@***.***> Sent: Thursday, August 17, 2023 1:15 AM To: markjprice/apps-services-net7 ***@***.***> Cc: mdevol58 ***@***.***>; Author ***@***.***> Subject: Re: [markjprice/apps-services-net7] link crossorigin property must be camelCased (Issue #20) Or was it this one? https://stackoverflow.com/questions/35323268/how-to-solve-resource-requires-the-request-to-be-cors-enabled-resource-has-bee — Reply to this email directly, <#20 (comment)> view it on GitHub, or <https://github.com/notifications/unsubscribe-auth/BB5OM7QBZBKSMAWL47XKYTLXVXHKBANCNFSM6AAAAAA3TID54A> unsubscribe. You are receiving this because you authored the thread. <https://github.com/notifications/beacon/BB5OM7UFFGNP2JNQDGTKTUDXVXHKBA5CNFSM6AAAAAA3TID54CWGG33NNVSW45C7OR4XAZNMJFZXG5LFINXW23LFNZ2KUY3PNVWWK3TUL5UWJTTEH3MEW.gif> Message ID: < ***@***.***> ***@***.***>

[markjprice]

I suspect it was some other problem that caused the error and it is a coincidence that changing the casing fixed it. Also note that the StackOverflow article is about using JavaScript to set the attribute rather than setting it directly and for that I suspect an issue with the JavaScript interpretor because JavaScript is more strongly case-senstive and uses camel casing. HTML shouldn't care about casing. Web development is a mystery sometimes!