Issues sections should link to web URL of file at given commit with highlighted line(s)

[BioPhoton]

User story

As a user of the CLI I want to have click through experience for all actionable feedback a get from the audit issues.

At the moment the provided issues often show exactly where the error needs to get fixed, but a manual navigation to the line of code is required.

Example:

Severity	Message	Source file	Line(s)
⚠️ warning	Lines 1-18 are not covered in any test case.	examples/plugins/src/index.ts	1-18
⚠️ warning	Line 104 is not covered in any test case.	examples/plugins/src/lighthouse/src/lighthouse.plugin.ts	104

Severity	Message	Source file	Line(s)
🚨 error	1st branch is not taken in any test case.	examples/plugins/src/file-size/src/file-size.plugin.ts	101
🚨 error	1st branch is not taken in any test case.	examples/plugins/src/index.ts	1

Acceptance criteria

• [ ] supported hosting provider:
  • GitLab
  • GitHub
• [ ] provide config remoteUrl to serve users with self-hosted repos. (common for enterprises)
• [ ] if we cannot detect provider, then we shouldn't include the link

Example:

Severity	Message	Source file	Line(s)
⚠️ warning	Lines 1-18 are not covered in any test case.	examples/plugins/src/index.ts	1-18
⚠️ warning	Line 104 is not covered in any test case.	examples/plugins/src/lighthouse/src/lighthouse.plugin.ts	104

Severity	Message	Source file	Line(s)
🚨 error	1st branch is not taken in any test case.	examples/plugins/src/file-size/src/file-size.plugin.ts	101
🚨 error	1st branch is not taken in any test case.	examples/plugins/src/index.ts	1

Implementation details

Get remote from current git: git remote -> 'origin'

Get remote url from current git: git remote get-url origin -> 'git@github.com:code-pushup/cli.git'

function generateGitHubUrl(source: Pick<SourceFileLocation, 'file' | 'position'>, remoteUrl: string, branch: string): string {
  const {file, position} = source;
  const {startLine = 0, endLine = 0} = position ?? {};
  const repoPath = remoteUrl.match(/github\.com[:/](.+)\.git/)?.[1];
  const lines = startLine ? `#L${startLine}${endLine ? `-L${endLine}` : ''}` : '';
  return `https://github.com/${repoPath}/blob/${branch}/${file}${lines}`;
}

function generateGitLabUrl(source: Pick<SourceFileLocation, 'file' | 'position'>, remoteUrl: string, branch: string): string {
  const {file, position} = source;
  const {startLine = 0, endLine = 0} = position ?? {};
  const repoPath = remoteUrl.match(/gitlab\.com[:/](.+)\.git/)?.[1];
  const lines = startLine ? `#L${startLine}${endLine ? `-${endLine}` : ''}` : '';
  return `https://gitlab.com/${repoPath}/-/blob/${branch}/${file}${lines}`;
}

Related Issues:

https://github.com/code-pushup/cli/issues/149

[vmasek]

@BioPhoton please rework this issue to just link to the local source example: src/index.ts