test/data/trusted-html.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4         <meta charset=utf-8 />
   5         <title>body</title>
   6 </head>
   7 <body>
   8 <div id="qunit-fixture"></div>
   9 <script src="../../dist/jquery.min.js"></script>
  10 <script src="iframeTest.js"></script>
  11 <script>
  12         var i, input, elem, tags, policy,
  13                 results = [],
  14                 inputs = [
  15                         [ "<div></div>", "<div class='test'></div>", [ "div" ] ],
  16                         [ "<div></div>", "<div class='test'></div><span class='test'></span>",
  17                                 [ "div", "span" ] ],
  18                         [ "<table></table>", "<td class='test'></td>", [ "td" ] ],
  19                         [ "<select></select>", "<option class='test'></option>", [ "option" ] ]
  20                 ];
  21
  22         function runTests( messagePrefix, getHtmlWrapper ) {
  23                 for ( i = 0; i < inputs.length; i++ ) {
  24                         input = inputs[ i ];
  25                         elem = jQuery( getHtmlWrapper( input[ 0 ] ) );
  26                         elem.append( getHtmlWrapper( input[ 1 ] ) );
  27                         tags = elem.find( ".test" ).toArray().map( function( node ) {
  28                                 return node.nodeName.toLowerCase();
  29                         } );
  30                         results.push( {
  31                                 actual: tags,
  32                                 expected: input[ 2 ],
  33                                 message: messagePrefix + ": " + input[ 2 ].join( ", " )
  34                         } );
  35                 }
  36
  37                 elem = jQuery( getHtmlWrapper( "<div></div>" ) );
  38                 elem.append( getHtmlWrapper( "text content" ) );
  39                 results.push( {
  40                         actual: elem.html(),
  41                         expected: "text content",
  42                         message: messagePrefix + ": text content properly appended"
  43                 } );
  44         }
  45
  46         if ( typeof trustedTypes !== "undefined" ) {
  47                 policy = trustedTypes.createPolicy( "jquery-test-policy", {
  48                         createHTML: function( html ) {
  49                                 return html;
  50                         }
  51                 } );
  52
  53                 runTests( "TrustedHTML", function wrapInTrustedHtml( input ) {
  54                         return policy.createHTML( input );
  55                 } );
  56         } else {
  57
  58                 // No TrustedHTML support so let's at least run tests with object wrappers
  59                 // with a proper `toString` function. This also shows that jQuery support
  60                 // of TrustedHTML is generic and would work with similar APIs out of the box
  61                 // as well. Ideally, we'd run these tests in browsers with TrustedHTML support
  62                 // as well but due to the CSP TrustedHTML enforcement these tests would fail.
  63                 runTests( "Object wrapper", function( input ) {
  64                         return {
  65                                 toString: function toString() {
  66                                         return input;
  67                                 }
  68                         };
  69                 } );
  70         }
  71
  72         startIframeTest( results );
  73 </script>
  74 </body>
  75 </html>