ISBAT receive consistent error notices using Gist block

[AnthonyLedesma]

Describe the bug When a request returns as a 404 the Gist block becomes unusable. The block should be improved by adding proper error handling using the existing error notice mechanism.

The Gist block is generating an error when applying a URL with a Gist file.

Original URL https://gist.github.com/AnthonyLedesma/33ad1a8cd86da3b6bddbdefa432cb51d#file-gistblocktest-text (Returns 200)

Transformed request https://gist.github.com/AnthonyLedesma/33ad1a8cd86da3b6bddbdefa432cb51d.json?callback=embed_gist_callback_NaN&file=gistblocktest.text (Returns 404)

To Reproduce Steps to reproduce the behavior:

1. Copy a Gist URL with a file.

• EG( https://gist.github.com/AnthonyLedesma/33ad1a8cd86da3b6bddbdefa432cb51d#file-gistblocktest-text )

2. Add Gist block to a page.
3. Paste the Gist URL with a file into the Gist block.
4. See error.

Screenshots

Gist URL without file

Gist URL with file and error returned from Github

Expected behavior Expect Gist block to properly load Gist files when a correct URL is provided. Expect Gist block to provide useful error notices and recover from invalid attributes.

Isolating the problem:

• This bug happens with no other plugins activated
• This bug happens with a default WordPress theme active
• This bug happens without the Gutenberg plugin active
• I can reproduce this bug consistently using the steps above

WordPress Version What version of WordPress are you using? 5.3.2

Gutenberg Version What version of the Gutenberg plugin are you using? (If any) N/A (Also happens with 7.4) active.

Side note I found it interesting that raw transforms properly handles both cases of URL with and without a file present. See Gif below.

[EvanHerman]

@AnthonyLedesma I was able to load a gist with a specified file in the URL without any issues: https://gist.github.com/laustdeleuran/1948627#file-two-js

Are you still encountering this bug?

[AnthonyLedesma]

The issue still happening on the Gist URLs I host. Looking further it looks like the specific URL https://gist.github.com/AnthonyLedesma/33ad1a8cd86da3b6bddbdefa432cb51d#file-gistblocktest-text is getting transformed into a query which returns a 404.

Transformed request https://gist.github.com/AnthonyLedesma/33ad1a8cd86da3b6bddbdefa432cb51d.json?callback=embed_gist_callback_NaN&file=gistblocktest.text (Returns 404)

We need to investigate why the error notice didn't appear for the user. Also, need to determine why this would query as a 404. (if it's happening here, could it happen for others?)

[olafleur]

The issue is caused when the file in the gist has a capital letter in it. The block infers the name from the URL, but the URL does not have the capital letters.

For example, if the file is App.js, the url will have #file-app-js at the end, which the block will conclude is app.js But if you put app.js instead of App.js in the callback call, it returns a 404.

I think a call to the Gist API would be needed to resolve the name of the file with capital letters.

[olafleur-godaddy]

With the Gist rewrite, the problem of files with capital letters has reappeared.