Add GitHub API query to bug report template (#21421)
This may help debug why sometimes the GitHub API search seems to not find a match when it should.
Brian Vaughn committed
May 4, 2021 at 00:09 UTC
b522638b994abfea16b981efdf88e11d1078c982
2 files changed
+21
-10
packages/react-devtools-shared/src/devtools/views/ErrorBoundary/ReportNewIssue.js
+9
-2
@@ -9,6 +9,7 @@
9
10
import * as React from 'react';
11
import Icon from '../Icon';
12
+import {searchGitHubIssuesURL} from './githubAPI';
13
import styles from './shared.css';
14
15
function encodeURIWrapper(string: string): string {
@@ -31,6 +32,9 @@ export default function ReportNewIssue({
32
return null;
33
}
34
35
+ const gitHubAPISearch =
36
+ errorMessage !== null ? searchGitHubIssuesURL(errorMessage) : '(none)';
37
+
38
const title = `Error: "${errorMessage || ''}"`;
39
const labels = ['Component: Developer Tools', 'Status: Unconfirmed'];
40
@@ -57,10 +61,13 @@ If possible, please describe how to reproduce this bug on the website or app men
61
DevTools version: ${process.env.DEVTOOLS_VERSION || ''}
62
63
Call stack:
60
-${callStack || '(not available)'}
64
+${callStack || '(none)'}
65
66
Component stack:
63
-${componentStack || '(not available)'}
67
+${componentStack || '(none)'}
68
+
69
+GitHub URL search query:
70
+${gitHubAPISearch}
71
`;
72
73
bugURL += `/issues/new?labels=${encodeURIWrapper(
packages/react-devtools-shared/src/devtools/views/ErrorBoundary/githubAPI.js
+12
-8
@@ -14,9 +14,7 @@ export type GitHubIssue = {|
14
15
const GITHUB_ISSUES_API = 'https://api.github.com/search/issues';
16
17
-export async function searchGitHubIssues(
18
- message: string,
19
-): Promise<GitHubIssue | null> {
17
+export function searchGitHubIssuesURL(message: string): string {
18
// Remove Fiber IDs from error message (as those will be unique).
19
message = message.replace(/"[0-9]+"/g, '');
20
@@ -29,13 +27,19 @@ export async function searchGitHubIssues(
27
'repo:facebook/react',
28
];
29
32
- const response = await fetch(
30
+ return (
31
GITHUB_ISSUES_API +
34
- '?q=' +
35
- encodeURIComponent(message) +
36
- '%20' +
37
- filters.map(encodeURIComponent).join('%20'),
32
+ '?q=' +
33
+ encodeURIComponent(message) +
34
+ '%20' +
35
+ filters.map(encodeURIComponent).join('%20')
36
);
37
+}
38
+
39
+export async function searchGitHubIssues(
40
+ message: string,
41
+): Promise<GitHubIssue | null> {
42
+ const response = await fetch(searchGitHubIssuesURL(message));
43
const data = await response.json();
44
if (data.items.length > 0) {
45
const item = data.items[0];