How to use and test the scripts and stylesheet with asp-fallback-test? | ecode10.com

How to use and test the scripts and stylesheet with asp-fallback-test?

Check here many examples

C#.NET

Thursday, March 12, 2026

Views: 27 SHARE

I was working on a significant project, an internal system that generates millions of dollars daily. As a developer, I proposed using a Content Delivery Network (CDN) instead of local files, reserving local files for specific instances.

I recently wrote a few articles about CDN and ASP-fallback, https://ecode10.com/article/3512/why-do-i-need-to-use-asp-fallback and https://ecode10.com/article/3509/how-to-use-aspfallbacksrc-with-csharp and https://ecode10.com/article/3508/how-to-use-aspfallbackhref but I’d like to share a real-world example of how to implement and test it.

Here is the CDN used by the system:

cdn.jsdelivr.net
use.fontawesome.com
cdnjs.cloudflare.com
fonts.googleapis.com

It's important to use:

For link rel="stylesheet"

asp-fallback-href
asp-fallback-test-class
asp-fallback-test-property
asp-fallback-test-value
asp-suppress-fallback-integrity
integrity

For script

asp-fallback-src
asp-fallback-test
asp-suppress-fallback-integrity
integrity

The code below shows you step by step.

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
      integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
      asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap.min.css"
      asp-fallback-test-class="d-none"
      asp-fallback-test-property="display"
      asp-fallback-test-value="none"
      asp-suppress-fallback-integrity="true"
      crossorigin="anonymous"/>
        	
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" 
    integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ"
      asp-fallback-href="~/lib/fontawesome/font-awesome-all.css"
      asp-fallback-test-class="fab"
      asp-fallback-test-property="font-style"
      asp-fallback-test-value="normal"
      asp-suppress-fallback-integrity="true"
    crossorigin="anonymous"/>
        
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js" 
    integrity="sha512-k2WPPrSgRFI6cTaHHhJdc8kAXaRM4JBFEDo1pPGGlYiOyv4vnA0Pp0G5XMYYxgAPmtmv/IIaQA6n5fLAyJaFMA=="
        asp-fallback-src="~/lib/jquery/dist/jquery.min.js"
        asp-fallback-test="window.jQuery"
        asp-suppress-fallback-integrity="true"
    crossorigin="anonymous" 
    referrerpolicy="no-referrer"></script>
        	
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/jquery-ui.min.js" 
    integrity="sha512-57oZ/vW8ANMjR/KQ6Be9v/+/h6bq9/l3f0Oc7vn6qMqyhvPd1cvKBRWWpzu0QoneImqr2SkmO4MSqU+RpHom3Q=="
        asp-fallback-src="~/lib/jquery/dist/jquery-ui.min.js"
        asp-fallback-test="window.jQuery && window.jQuery.ui"
        asp-suppress-fallback-integrity="true"
    crossorigin="anonymous" 
    referrerpolicy="no-referrer"></script>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.19/css/dataTables.bootstrap4.min.css"
      integrity="sha512-4o2NtfcBGIT0SbOTpWLYovl07cIaliKIQpUXvEPvyOgBF/01xY1TXm5F1B+X48/zhhFLIw2oBTsE0rjcwEOwJQ=="
      crossorigin="anonymous"
      asp-fallback-href="~/lib/datatables/1.10.19/css/dataTables.bootstrap4.min.css"
      asp-fallback-test-class="dataTable_wrapper"
      asp-fallback-test-property="display"
      asp-fallback-test-value="block"
      referrerpolicy="no-referrer" />

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.14.0-beta2/css/bootstrap-select.min.css"
      integrity="sha512-mR/b5Y7FRsKqrYZou7uysnOdCIJib/7r5QeJMFvLNHNhtye3xJp1TdJVPLtetkukFn227nKpXD9OjUc09lx97Q=="
      asp-fallback-href="~/lib/bootstrap/dist/css/bootstrap-select.min.css"
      asp-fallback-test-class="bootstrap-select"
      asp-fallback-test-property="position"
      asp-fallback-test-value="absolute"
      crossorigin="anonymous"
      referrerpolicy="no-referrer" />
        
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/2.11.8/umd/popper.min.js" 
        integrity="sha512-TPh2Oxlg1zp+kz3nFA0C5vVC6leG/6mm1z9+mA81MI5eaUVqasPLO8Cuk4gMF4gUfP5etR73rgU/8PNMsSesoQ==" 
        asp-fallback-src="~/lib/jquery/dist/popper.min.js"
        asp-fallback-test="window.Popper"
        asp-suppress-fallback-integrity="true"
        crossorigin="anonymous" 
        referrerpolicy="no-referrer">
</script>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
        integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
        asp-fallback-src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"
        asp-fallback-test="window.bootstrap"
        asp-suppress-fallback-integrity="true"
        crossorigin="anonymous">
</script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.19/js/jquery.dataTables.min.js"
        integrity="sha512-c2bQrjZ1iFm8q28SJKvX+A/H6ItQ+jumpms8XGVRkpc2lWxiNl1WcoI4pf0g5/1tDfcShv7oTwzWF3qizR03ZQ=="
        asp-fallback-src="~/lib/datatables/1.10.19/js/jquery.dataTables.min.js"
        asp-fallback-test="window.jQuery && window.jQuery.fn.dataTable"
        asp-suppress-fallback-integrity="true"
        crossorigin="anonymous"
        referrerpolicy="no-referrer">
</script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.19/js/dataTables.bootstrap4.min.js"
        integrity="sha512-LNaU4dKqd/wXAdyvZg+hH0YqMIlEVJNe1qFoIdqLr1S/ontCVJGn7fM7YUos9oqHRfmTgok1DTtUHpvxzNRrEg=="
        asp-fallback-src="~/lib/datatables/1.10.19/js/dataTables.bootstrap4.min.js"
        asp-fallback-test="window.jQuery.fn.dataTable"
        asp-suppress-fallback-integrity="true"
        crossorigin="anonymous"
        referrerpolicy="no-referrer">
</script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.14.0-beta2/js/bootstrap-select.min.js"
        integrity="sha512-FHZVRMUW9FsXobt+ONiix6Z0tIkxvQfxtCSirkKc5Sb4TKHmqq1dZa8DphF0XqKb3ldLu/wgMa8mT6uXiLlRlw=="
        asp-fallback-src="~/lib/bootstrap/dist/js/bootstrap-select.min.js"
        asp-fallback-test="window.jQuery.fn.selectpicker"
        asp-suppress-fallback-integrity="true"
        crossorigin="anonymous"
        referrerpolicy="no-referrer">
</script>

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap"              
      asp-fallback-href="~/lib/googlefonts/google-fonts-css2.css"
      asp-fallback-test-class="font-test-class"
      asp-fallback-test-property="font-family"
      asp-fallback-test-value="'Open Sans', sans-serif"/>

Code 1 - All stylesheets and scripts

I hope you enjoy it and help your code.

Doubts, you can ask me or access my website mauricios.me