Interface automatically switches to "File" after selecting "URL" and launching

[jenna-jordan]

Hello,

I recently made a binder with voila, which requires "URL" to be selected for the "path to notebook" field. After the notebook launched, I went back to get the binder badge/url, and noticed that the url had been changed so that instead of "urlpath=" it was "filepath=". That means when this url is used (or the badge clicked) it will redirect to a 404 page.

I had previously had a problem of the notebook launching, but consistently redirecting to the 404 page and not showing the voila styled notebook. I can't reproduce that anymore and am not positive what caused it, but perhaps it was the same issue of "url" being switched to "file".

Before launching:

After launching and going back one page in my browser (firefox):

[sgibson91]

I think the issue here is that it's not clear that the default option is always ?filepath= when the website loads. Considering the rest of the filled form persists, it would be nice if the filepath/urlpath option also persisted. I'm not sure how difficult that is to implement though.

On a related note, I've fielded quite a few issues recently regarding 404 errors from people who want to use voila. It might be useful if we add a third voila option to that dropdown menu which sets ?urlpath= and automatically prepends the filepath with /voila/render/.

[sgibson91]

Also when opening a standard notebook in Binder, there is a button at the top that says "Copy Binder link" and this copies the correct Binder link to your clipboard. It's unfortunate that the voila rendering overwrites this functionality 😕

Update: Just checked and this is also true for the JupyterLab and RStudio interfaces

[jenna-jordan]

A special voila option (in addition to url and file) would be very nice - so the "voila/render/" would become unnecessary, it would persist, and perhaps there could be an automatic behavior to open the rendered voila page in a new tab, so going back to get the badge isn't necessary.

[sgibson91]

(I know this is clunky, so I'm sorry 😫) One immediate solution to your frustrations would be to copy the link from the "Copy the URL below..." and open that in a new tab, so then the state of the binder form (and correct badge URL) persists and you don't have to go back and forth. Screenshot added for clarity.

Also, thank you for opening this issue 🎉🌻✨

[betatim]

We should try and chase down what we need to do/stop doing so that the form persists with the right option selected in the dropdown. That seems like something which is just wrong.

To make sure about the steps you took: fill out form, pressed launch, then on the page with the spinner you pressed the back button in your browser, the wrong drop down is now selected.

The "share" buttons you see in the normal notebook interface are missing from the other UIs because it requires us to customise each UI separately to put the buttons there :-/

---

On the idea of adding an extra dropdown option for Voila: I recently tried to explain to someone how they could get a link that would send users directly to RStudio as UI or a Shiny app. My take away from that was also that it is far too complicated to do. Maybe we should rethink the whole form to make it easier to use. There are some thoughts on that in #880 and #844. Maybe we should revive those issues. All help in terms of HTML/CSS/design/etc is very welcome (and needed ;) ). I think we should make this a priority.

[jenna-jordan]

Yes, those are the steps that I took.

As a hack-y solution, it might be useful to force the interface to choose "url" in the menu and "urlpath=" in the URL if it detects "voila/render/ in the "path to notebook" field.

[sgibson91]

@betatim On the share buttons/UI point, can we create an overlay frame rather than edit each UI?

[betatim]

We have discussed iFrames as a way to add buttons, banners, etc but in the past they received a lot of strong negative opinions. Mostly around how it breaks the connection between what you see as the URL in your browsers location bar and what you are actually looking at as well as the back button/history in your browser. I think a way forward. would be for some simple iFrame setup to be made that people can test drive in different browsers. I reckon browsers and interacting with them is such a complex topic that at least I can't do it all in my head. Need something to click around on. dummy content will work just enough that we could demo the up- and down-sides. (Should we discuss this train of though in a new or one of the existing "new UI" threads instead of here?)

---

I like the idea of automatically changing the value of the dropdown menu. We could also use that for when people type in "rstudio" or "shiny". Building it will be a bit tricky (I think) because you need to trigger the automatic behaviour most of the time but let the user override/disable it. So a PR would be cool so we can figure out these kinds of details and corner cases. Do you want to give it a go?