testing/web-platform/tests/clipboard-apis/async-write-svg-read-svg.https.html

   1 <!doctype html>
   2 <meta charset="utf-8">
   3 <title>
   4   Async Clipboard write ([image/svg+xml ClipboardItem]) -> read and write svg tests
   5 </title>
   6 <link rel="help" href="https://w3c.github.io/clipboard-apis/#async-clipboard-api">
   7 <body>Body needed for test_driver.click()</body>
   8 <script src="/resources/testharness.js"></script>
   9 <script src="/resources/testharnessreport.js"></script>
  10 <script src="/resources/testdriver.js"></script>
  11 <script src="/resources/testdriver-vendor.js"></script>
  12 <script src="resources/user-activation.js"></script>
  13 <script>
  14 'use strict';
  15 // This function removes extra spaces between tags in svg. For example, the
  16 // following html: "<svg> <g> </g>   </svg>" would turn into this
  17 //           html: "<svg> <g> </g>   </svg>"
  18 // We remove the extra spaces because in svg they are considered equivalent,
  19 // but when we are comparing for equality the spaces make a difference.
  20 function reformatSvg(svg) {
  21   const parser = new DOMParser();
  22   const svgString =
  23         parser.parseFromString(svg, 'text/html').documentElement.innerHTML;
  24   const reformattedString = svgString.replace(/\>\s*\</g, '> <');
  25   return reformattedString;
  26 }
  27
  28 async function readWriteTest(textInput) {
  29   await test_driver.set_permission({name: 'clipboard-read'}, 'granted');
  30   await test_driver.set_permission({name: 'clipboard-write'}, 'granted');
  31   const blobInput = new Blob([textInput], {type: 'image/svg+xml'});
  32   const clipboardItem = new ClipboardItem({'image/svg+xml': blobInput});
  33   await waitForUserActivation();
  34   await navigator.clipboard.write([clipboardItem]);
  35   await waitForUserActivation();
  36   const clipboardItems =
  37       await navigator.clipboard.read({type: 'image/svg+xml'});
  38
  39   const svg = clipboardItems[0];
  40   assert_equals(svg.types.length, 1);
  41   assert_equals(svg.types[0], 'image/svg+xml');
  42
  43   const blobOutput = await svg.getType('image/svg+xml');
  44   assert_equals(blobOutput.type, 'image/svg+xml');
  45
  46   const blobText = await (new Response(blobOutput)).text();
  47   const outputSvg = reformatSvg(blobText);
  48   const inputSvg = reformatSvg(textInput);
  49   assert_equals(outputSvg, inputSvg);
  50 }
  51 const testCases = ['<svg></svg>',
  52                    '<svg> <circle cx="50" cy="50" r="40" /> </svg>'];
  53
  54 promise_test(async t => {
  55   for (const testCase of testCases) {
  56     await readWriteTest(testCase);
  57   }
  58 }, 'Verify read and write of some image/svg+xml content');
  59
  60 </script>