Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add DOM hook to allow links to be added after the Rerun link #1717

Open
david-pfx opened this issue Jun 23, 2023 · 1 comment
Open

Add DOM hook to allow links to be added after the Rerun link #1717

david-pfx opened this issue Jun 23, 2023 · 1 comment
Labels
Milestone

Comments

@david-pfx
Copy link

Using 2.19.4, Windows, browser
New feature: Add DOM hook to allow links to be added after the Rerun link
Eg link to source code, link to docs, link to Git etc
Can already be done by walking the tree, but a better method would add value.

@Krinkle Krinkle added this to the 3.0 release milestone Jul 3, 2023
@Krinkle Krinkle added the Type: Enhancement New idea or feature request. label Jul 3, 2023
@Krinkle Krinkle modified the milestones: 3.0 release, 3.x release Jun 19, 2024
@Krinkle
Copy link
Member

Krinkle commented Jul 10, 2024

@david-pfx Coud you share an example or two of the kind of links you'd like to insert, and what (if any) test information you use to builld the links?

I've recently documented the beginnings of the "HTML API" at https://qunitjs.com/browser/#html-api

Here is how you might use it:

Screenshot
QUnit.hooks.afterEach(function () {
  const test = QUnit.config.current;
  const testItem = document.querySelector('#qunit-test-output-' + test.testId);
  const assertList = testItem.querySelector('ol');

  // Append "View source" link
  const fileName = /.*\/([^/:]+):/.exec((test.stack || '').split('\n')[0])?.[1];
  if (fileName) {
    const url = `https://github.com/search?type=code&q=${encodeURIComponent('org:qunitjs path:"' + fileName + '"')}`;
    testItem.insertBefore(
      Object.assign(document.createElement('a'), {
        href: url,
        textContent: 'View source'
      }),
      assertList
    );
  }
});

I suspect this is close to what you have already, but I figured I'd recognise and support it.
We could ease this by wrapping "Rerun" in a <span> with a documented class like qunit-test-actions that you can safely append to, instead of having to manually position it relative to "runtime" and "assert-list":

QUnit.hooks.afterEach(function () {
  const test = QUnit.config.current;
  const testActions = document.querySelector(`#qunit-test-output-${test.testId} .qunit-test-actions`);

  // Append "View source" link
  const fileName = /.*\/([^/:]+):/.exec((test.stack || '').split('\n')[0])?.[1];
  if (fileName) {
    const url = `https://github.com/search?type=code&q=${encodeURIComponent('org:qunitjs path:"' + fileName + '"')}`;
    testActions.append(Object.assign(document.createElement('a'), {
      href: url,
      textContent: 'View source'
    }));
  }
});

A more constrained but declarative API could look like this:

QUnit.on('htmlTestActions', (e) => {
  e.status; // "passed"
  e.testDone; // https://qunitjs.com/api/callbacks/QUnit.testDone

  e.actions.push({
    url: '…',
    label: 'View source'
  });
});

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Development

No branches or pull requests

2 participants