Try and detect CORS errors and report them to users

[agoose77]

Context

We saw a misconfigured Binder instance that had problems with CORS, but it wasn't visible from the UI that it was CORS at fault! I wonder if we can see this and surface it to the users.

Proposal

No response

Tasks and updates

No response

[stevejpurves]

any idea on how to reproduce that easily @agoose77?

[agoose77]

The check that I used was to spin up a trivial event source, and look for CORS errors in the browser console. Here's an example for the Pythia cookbook that, at the time, was failing to launch

const es = new EventSource("https://binder.projectpythia.org/build/gh/ProjectPythia/HRRR-AWS-cookbook/HEAD") 
es.close()

I'm not sure if it's trivial to programatically detect the CORS issue, now that I think about it. I'm not sure if the EventSource actually exposes this information. Maybe the best we can do is:

• Try the happy-path of loading the event stream
• Detect an error, try to fetch the base Binder URL (e.g. the index page)
  • If 404, throw a useful error
  • If 200, suggest maybe CORS or something else is wrong.