Repository: electron/electron (language: cpp)

Issue:
add upstream doc links to default window
when we run `electron` a default window opens that has chromium and nodejs versions at the top. would be really helpful if these would be links to the upstream docs, just like the links at the bottom.

old nodejs docs can be found here https://nodejs.org/docs/ but not sure where to find chromium html, css and javascript docs for a specific version.


Discussion / hints:
👋 Thanks for opening your first issue here! If you're reporting a 🐞 bug, please make sure you include steps to reproduce it. We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.

To help make it easier for us to investigate your issue, please follow the [contributing guidelines](https://github.com/electron/electron/blob/master/CONTRIBUTING.md).

> when we run `electron` a default window opens that has chromium and nodejs versions at the top. would be really helpful if these would be links to the upstream docs, just like the links at the bottom.
> 
> old nodejs docs can be found here https://nodejs.org/docs/ but not sure where to find chromium html, css and javascript docs for a specific version.

Hi! I'm a beginner at programming and I'd like to start contributing to some open-source projects, I'm interested in helping with this issue, how should I begin?
i guess the begin is here: (you want to create a pull request, when your changes work)
https://github.com/electron/electron/blob/master/CONTRIBUTING.md

i guess the affected sources are:
https://github.com/electron/electron/blob/master/default_app/index.html#L15
https://github.com/electron/electron/blob/master/default_app/renderer.js#L31

and a quick guess could be something like this:
replace
```
document.querySelector('.node-version').innerText = `Node v${process.versions.node}`
```
with
```
document.querySelector('.node-version').innerHTML = `<a href="https://nodejs.org/docs/v${process.versions.node}">Node v${process.versions.node}</a>`
```

and then the fun with chromium documentation...
Great, I'm starting on it but I'm just having some issues building the windows version - for some reason gclient is not recognized as a command - I've tried using the VS command line too but hopefully I'll figure it out, if you have any ideas though I'm all ears.
@123epsilon See the [GN Prerequisites](https://github.com/electron/electron/blob/master/docs/development/build-instructions-gn.md#gn-prerequisites) in our build instructions
> @123epsilon See the [GN Prerequisites](https://github.com/electron/electron/blob/master/docs/development/build-instructions-gn.md#gn-prerequisites) in our build instructions

I'm using those, and they are proving helpful. I am running into an issue installing gclient however, when I run the command "gclient" in cmd.exe I get an error stating that the module for urlparse does not exist within the gclient.py file - I tried manually editing this and it fixed the issue (I suspect it has something to do with urlparse being renamed in python 3), however it now states that I have to commit or stash these changes, which I don't know how to do, given that gclient is installed in my local pc - not in a git repository.
@123epsilon You need to be using python 2
@MarshallOfSound I'm using 2.7, I was just checking that it changed the output. Puzzlingly, the urlparse.py is present in my installation of python 2.7 so I don't know what is causing the error with the gclient installation :(


@MarshallOfSound Nevermind! I had an old install of python 3.6 in my system path variable and so gclient pulled from that library instead of python 2.7 - thanks for the help

Is this issue still open? If so, I'd like to take a shot at it!
Is this issue still open? I'd like to take a shot at it!
If this is still open ,I'd like to tackle it
If someone wants to work on this, please keep in mind the review comments that have been posted to an earlier attempt at fixing this: https://github.com/electron/electron/pull/17196
@miniak Can you explain what you mean by drawbacks? Is it because there is no URL for version-specific chrome documentation?
can anyone tell how to be a contributor and how I create pull request because while raising PR it's show first I have to be a contributor.




> when we run `electron` a default window opens that has chromium and nodejs versions at the top. would be really helpful if these would be links to the upstream docs, just like the links at the bottom.
> 
> old nodejs docs can be found here https://nodejs.org/docs/ but not sure where to find chromium html, css and javascript docs for a specific version.

Hi! I'm a beginner at programming and I'd like to start contributing to some open-source projects, I'm interested in helping with this issue, how should I begin?

Fix patch:
diff --git a/default_app/preload.ts b/default_app/preload.ts
index aa8c79ea11cca..fb6b9d4eaafb3 100644
--- a/default_app/preload.ts
+++ b/default_app/preload.ts
@@ -34,18 +34,25 @@ async function loadSVG (element: HTMLSpanElement) {
 
 async function initialize () {
   const electronPath = await ipcRenderer.invoke('bootstrap');
-
-  function replaceText (selector: string, text: string) {
+  function replaceText (selector: string, text: string, link?: string) {
     const element = document.querySelector<HTMLElement>(selector);
     if (element) {
-      element.innerText = text;
+      if (link) {
+        const anchor = document.createElement('a');
+        anchor.textContent = text;
+        anchor.href = link;
+        anchor.target = '_blank';
+        element.appendChild(anchor);
+      } else {
+        element.innerText = text;
+      }
     }
   }
 
-  replaceText('.electron-version', `Electron v${process.versions.electron}`);
-  replaceText('.chrome-version', `Chromium v${process.versions.chrome}`);
-  replaceText('.node-version', `Node v${process.versions.node}`);
-  replaceText('.v8-version', `v8 v${process.versions.v8}`);
+  replaceText('.electron-version', `Electron v${process.versions.electron}`, 'https://electronjs.org/docs');
+  replaceText('.chrome-version', `Chromium v${process.versions.chrome}`, 'https://developer.chrome.com/docs/chromium');
+  replaceText('.node-version', `Node v${process.versions.node}`, `https://nodejs.org/docs/v${process.versions.node}/api`);
+  replaceText('.v8-version', `v8 v${process.versions.v8}`, 'https://v8.dev/docs');
   replaceText('.command-example', `${electronPath} path-to-app`);
 
   for (const element of document.querySelectorAll<HTMLSpanElement>('.octicon')) {


Test patch: