test_text-fragments-get-text-directive-ranges.html

Enable keyboard shortcuts

CI results over the last 21 days

13,192Runs

100%Pass

0Failures

0Timeouts

0Crashes

0Skips
This test gets skipped with pattern: os == 'linux' && os_version == '24.04' && arch == 'x86_64' && debug && verify-standalone
Manifest: dom/base/test/mochitest.toml

<!DOCTYPE html>

<html>

<head>

  <title>Text Fragment Chrome-only API Test</title>

  <meta charset="UTF-8">

  <script src="/tests/SimpleTest/SimpleTest.js"></script>

  <script src="/tests/SimpleTest/GleanTest.js"></script>

  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />

</head>

<body>

<p>

    sample text.

  </p>

<p>

    he's falling.

  </p>

<p>

3.5

  </p>

<p>

    <span>40</span><span>.</span><span>2</span>

  </p>

  <div>

    <p>II</p>

    <p>the cat</p>

  </div>

  <script>

    SimpleTest.waitForExplicitFinish();

    async function changeHash(newHash) {

      let hashChange = new Promise(r => window.addEventListener('hashchange', r, { once: true }));

      location.hash = newHash;

      await hashChange;

    async function testGetTextDirectiveRangesAndRemoveRanges() {

      const directiveFindTimeStart = await GleanTest.domTextfragment.findDirectives.testGetValue() ?? {count: 0};

      console.log(directiveFindTimeStart.count);

      await changeHash('#:~:text=sample%20text');

      let ranges = SpecialPowers.wrap(document).fragmentDirective.getTextDirectiveRanges();

      is(ranges.length, 1, 'Should have one text directive range');

      const rangeText = ranges[0].toString();

      is(rangeText, "sample text", 'The range text should match the expected text');

      SpecialPowers.wrap(document).fragmentDirective.removeAllTextDirectives();

      ranges = SpecialPowers.wrap(document).fragmentDirective.getTextDirectiveRanges();

      is(ranges.length, 0, "Should have removed all text directive ranges");

      const directiveFindTime1 = await GleanTest.domTextfragment.findDirectives.testGetValue();

      is(directiveFindTime1.count, directiveFindTimeStart.count + 1, "1: Glean should have recorded the time it took to find the text directive");

      await changeHash("#:~:text=sample&text=text");

      ranges = SpecialPowers.wrap(document).fragmentDirective.getTextDirectiveRanges();

      is(ranges.length, 2, 'Should have two text directive ranges');

      is(ranges[0].toString(), "sample", "The first text directive should be the first range");

      is(ranges[1].toString(), "text", "The second text directive should be the second range");

      SpecialPowers.wrap(document).fragmentDirective.removeAllTextDirectives();

      await changeHash("#:~:text=text&text=sample");

      ranges = SpecialPowers.wrap(document).fragmentDirective.getTextDirectiveRanges();

      is(ranges.length, 2, 'Should have two text directive ranges');

      // This mirrors the behavior of `Selection`, where the ranges are sorted by

      // their position in the document. I'm not sure I want this.

      is(ranges[0].toString(), "sample", "The first text directive should be the first range");

      is(ranges[1].toString(), "text", "The second text directive should be the second range");

      SpecialPowers.wrap(document).fragmentDirective.removeAllTextDirectives();

      // "he" in "he's" isn't a whole word, so text=he must find no match.

      let directive = "#:~:text=he";

      await changeHash(directive);

      ranges = SpecialPowers.wrap(document).fragmentDirective.getTextDirectiveRanges();

      is(ranges.length, 0, `"${directive}" should NOT match since "he" is not word-bounded`);

      SpecialPowers.wrap(document).fragmentDirective.removeAllTextDirectives();

      // he's is a whole word, so should match

      directive = "#:~:text=he%27s";

      await changeHash(directive);

      ranges = SpecialPowers.wrap(document).fragmentDirective.getTextDirectiveRanges();

      ok(ranges.length === 1 && ranges[0].toString() === "he's",

        `"${directive}" should match he's.`);

      SpecialPowers.wrap(document).fragmentDirective.removeAllTextDirectives();

      directive = "#:~:text=5";

      await changeHash(directive);

      ranges = SpecialPowers.wrap(document).fragmentDirective.getTextDirectiveRanges();

      is(ranges.length, 0, `"${directive}" should NOT match mid-number inside 3.5`);

      SpecialPowers.wrap(document).fragmentDirective.removeAllTextDirectives();

      directive = "#:~:text=3%2E";

      await changeHash(directive);

      ranges = SpecialPowers.wrap(document).fragmentDirective.getTextDirectiveRanges();

      is(ranges.length, 0, `"${directive}" should NOT match 3. in 3.5`);

      SpecialPowers.wrap(document).fragmentDirective.removeAllTextDirectives();

      directive = "#:~:text=2";

      await changeHash(directive);

      ranges = SpecialPowers.wrap(document).fragmentDirective.getTextDirectiveRanges();

      is(ranges.length, 0, `"${directive}" should NOT match mid-number inside multi-node 40.2`);

      SpecialPowers.wrap(document).fragmentDirective.removeAllTextDirectives();

      directive = "#:~:text=i-,the%20cat";

      await changeHash(directive);

      ranges = SpecialPowers.wrap(document).fragmentDirective.getTextDirectiveRanges();

      is(ranges.length, 0,

        `${directive} must not match: 'II' second I is mid-word, not a prefix word-start`);

      SpecialPowers.wrap(document).fragmentDirective.removeAllTextDirectives();

    async function runTests() {

      try {

        await SpecialPowers.pushPrefEnv({"set": [

        ["dom.text_fragments.enabled", true],

      ]});

        await testGetTextDirectiveRangesAndRemoveRanges();

      finally {

        SimpleTest.finish();

    document.body.onload = runTests;

  </script>

</body>

</html>