/preview

Please find a preview at: https://staging.nodejs.dev/912/

Direct link for your reference: https://staging.nodejs.dev/912/download

I didn't link the download page in the header yet since it makes sense to wait until we finalize the rest of the downloads table below first.

Thanks for the effort @JemJem
Any idea on why it's defaulting to the source code selection when I'm on a Mac?
Here's a screenshot of the log

👍 on not making the /download public yet

that's odd: I also tested on a mac, and it highlighted the mac installer as expected for me. Not totally sure on that front.

I didn't write the logic for which group to highlight initially, but I noticed there were those logs in there. I'm sure there's a hook nearby to troubleshoot. (If anyone else is exploring this, please let me know if you run into the same issues and if you have any troubleshooting notes you can add.)

I'm also on a mac and what I have found is that:

1. Navigating to https://staging.nodejs.dev/912/download/ correctly identifies the mac installer.
2. If you first go to https://staging.nodejs.dev/912 and then change the URL to navigate to https://staging.nodejs.dev/912/download it defaults to selecting source code

Hey, I looked into this and it seems like it only breaks when the trailing "/" is not in the url https://staging.nodejs.dev/912/download and It does a redirect back to https://staging.nodejs.dev/912/download/ (with slash). Now i am not sure how gatsby works since this is the first time ever using it, but i suspect navigator is not available after that redirect (SSR?). If this is the case then the default selected os won't change when the userOS is retrieved.

  const [selected, setSelected] = useState(
    !(['WIN', 'MAC', 'MOBILE'].indexOf(userOS) >= 0) ? 'SOURCECODE' : userOS
  );

once the component is mounted, one would need a useEffect to change that default value. The following seems to fix this issue. This is usually a common pitfall when setting state based on props.

  const [selected, setSelected] = useState('');

  useEffect(() => {
    setSelected(
      !(['WIN', 'MAC', 'MOBILE'].indexOf(userOS) >= 0) ? 'SOURCECODE' : userOS
    );
  }, [userOS]);

You can test it by running npm run serve and using a Hard Reload.

Yep @miguelc1221 This fixes it. I tried a "production" build locally using gatsby build and ran a python server to load the files locally. Thanks for the help 👍

Nice! Really appreciate the distributed troubleshooting on this, your useEffect approach is a great solution. I'm going to add this.

Please find a preview at: https://staging.nodejs.dev/912/

Thanks @jemjam for having the time to make this work <3

For some reason I am getting this when trying to preview

[Edit: Removed image]

For some reason I am getting this when trying to preview

Is this error from clicking https://staging.nodejs.dev/912/ ? I just tried on mobile iPhone XR and it works, including going to the /downloads page

[Edit: Removed image]
For some reason I am getting this when trying to preview

Is this error from clicking https://staging.nodejs.dev/912/ ? I just tried on mobile iPhone XR and it works, including going to the /downloads page

It's working fine for me too.

Nice! Really appreciate the distributed troubleshooting on this, your useEffect approach is a great solution. I'm going to add this.

No problem! Glad I could help!