QUnit - Configurazione dell'ambiente

Esistono due modi per utilizzare QUnit.

  • Local Installation - È possibile scaricare la libreria QUnit sulla macchina locale e includerla nel codice HTML.

  • CDN Based Version - È possibile includere la libreria QUnit nel codice HTML direttamente da Content Delivery Network (CDN).

Installazione locale

  • Vai al https://code.jquery.com/qunit/ per scaricare l'ultima versione disponibile.

  • Posiziona il file qunit-git.js e qunit-git.css file in una directory del tuo sito web, ad esempio / jquery.

Esempio

Puoi includere qunit-git.js e qunit-git.css file nel file HTML come segue:

<html> 
   <head> 
      <meta charset = "utf-8"> 
      <title>QUnit basic example</title> 
      <link rel = "stylesheet" href = "/jquery/qunit-git.css"> 
      <script src = "/jquery/qunit-git.js"></script> 
   </head> 
   
   <body> 
      <div id = "qunit"></div> 
      <div id = "qunit-fixture"></div>  
      <script> 
         QUnit.test( "My First Test", function( assert ) { 
            var value = "1"; 
            assert.equal( value, "1", "Value should be 1" ); 
         }); 
      </script> 
   </body> 
</html>

Questo produrrà il seguente risultato:

Versione basata su CDN

È possibile includere la libreria QUnit nel codice HTML direttamente da Content Delivery Network (CDN).

Stiamo utilizzando la versione CDN di jQuery della libreria in questo tutorial.

Esempio

Riscriviamo l'esempio precedente utilizzando la libreria QUnit da jQuery CDN.

<html>
   <head>
      <meta charset = "utf-8">
      <title>QUnit basic example</title>
      <link rel = "stylesheet" href = "https://code.jquery.com/qunit/qunit-1.22.0.css">
      <script src = "https://code.jquery.com/qunit/qunit-1.22.0.js"></script>
   </head>
   
   <body>
      <div id = "qunit"></div>
      <div id = "qunit-fixture"></div> 
      <script>
         QUnit.test( "My First Test", function( assert ) {
            var value = "1";
            assert.equal( value, "1", "Value should be 1" );
         });
      </script>
   </body>
</html>

Questo produrrà il seguente risultato: