Microsoft MakeCode

Tutorial Help - "Please check your internet connection and check the tutorial is valid."

micro:bit
#1

Hi,

I followed the steps in this video MakeCode for micro:bit - Creating Tutorials to create a tutorial. When I clicked RUN on the Tutorial Tool, I got this error message - “Oops, an error occurred as we were loading the tutorial”.

image
image713×815 34.3 KB

I also tried using GitHub-MakeCode Editor and received the same error message when I tried to load the tutorial using the shared link.

And when I clicked Preview in MakeCode Editor, I got this message - “Please check your internet connection and check the tutorial is valid.”

image
image1629×609 177 KB

My internet connection was okay. I’ve tried to open using an incognito window and also tried to open using another browser. And I’ve also tried signing out from GitHub.

What could be the problem? How to check whether a tutorial is “valid”?
Appreciate some pointers to move forward. Thanks in advance.

Cheers,
Cheryl

#2

Hmm, could you post the markdown/text of your tutorial? Our error messages unfortunately aren’t great, but usually this means something in the tutorial was formatted in a way that we couldn’t gracefully handle and the project crashes/errors out instead.

#3

Hi, thanks for your response.

I managed to get the shared link to work after I corrected a formatting error. My mistake there.

The preview is still not working though. Still getting the same error message - “Please check your internet connection and check the tutorial is valid.”

Here’s the URL link to the markdown -https://github.com/CherylNg/test_tutorial/blob/master/tutorial.md

This is my first attempt at writing a tutorial. Do point out if I’m doing anything wrong here. Thanks for your help.

Cheers,
Cheryl

#4

Oh! Your tutorial loads for me! Try it in an incognito browser window, or refresh your entire page and load the tutorial again? Sometimes the embedded editor can get into a bad state–basically the same as if the page crashed.

#5

@jwunderl is anyone else having problems loading tutorials in micro:bit 4.0.9? Kid Spark Education is putting our entire curriculum in the MakeCode tutorials, and I’d like to feel confident that it’s stable.

#6

I’ve been having lots of issues with tutorials today. Even the default example in the tutorial tool will not load, but it does load for the other targets.

#7

Hm first I’ve seen it but yeah, it looks like there’s something broken with loading tutorials when opening tutorials that have no code snippets – e.g.

# My Tutorial

## Step 1

Here is some text.

```blocks
let a = "a"
```

## Step 2

Congratulations, you did it!

Works fine but

# My Tutorial

## Step 1

Here is some text.

## Step 2

Congratulations, you did it!

is broken (specifically, it errors out while identifying used blocks).

We’ll fix though~ (@shakao for reference, I’ll take a look real quick since I have an easy repro)

#8

Also is there a way to use images in tutorials that are stored in the github repo of the tutorial author?

/docs/static in the documentation is for pxt-microbit/docs/static

Other authors have used their own web server outside of the github tutorial repo as a workaround, but it would be nice is the images could be stored in the same repo as the tutorial md file.

#9

I haven’t personally attempted using an image in an external tutorial in a while so I can’t confirm immediately, but if loading in an image from external site currently works then they can just be stored in the repo itself; all the files on github get stored under githubusercontent e.g.
https://raw.githubusercontent.com/microsoft/pxt-microbit/master/docs/static/v2/back.jpg

is the place that the image https://github.com/microsoft/pxt-microbit/blob/master/docs/static/v2/back.jpg is stored. It’s easy to create the link if you have the github link by just comparing the two, but you can also right click → copy image address to get it easily:

image

and going to the link (it has a different one by default that redirects, either should be fine: https://github.com/microsoft/pxt-microbit/blob/master/docs/static/v2/back.jpg?raw=true)

#10

Thanks @jwunderl that’s so obvious now that you say it! Yes, it works fine.

#11

Hm, we haven’t had many reports of tutorial instability (the same tutorial sometimes loading and not loading), if you have specific tutorials where you’ve been seeing this behavior it would be great if you could link the markdown files. Additionally, if you have what browser it was being loaded on that would be super helpful!

#12

@shakao it’s mainly been around loading the tutorial. Once it loads, I usually don’t have any problems.

I noticed a new problem tonight that sometimes my embedded text for ||advanced:Advanced|| and ||serial:Serial|| don’t show in the correct color. Yet, they show correctly in the side-panel preview.

#13

Do you have a link to the tutorial files where you’re seeing the issue? We can take a look! “Advanced” won’t be colored correctly since it’s an expanding drawer and not a “real” toolbox category–this is probably a feature we should add, I’ll make a note of it.

#14

@shakao There doesn’t seem to be any consistency to the loading problems…sometimes they load, somethings they don’t. But it could also be local cache and some of the revision changes during the beta updates (see post 8364).

Now that 2021 is released, the only load problem has been the tutorial without the code snippets discussed above.

The repo is here if you want to take a look: https://github.com/KidSpark/tutorials

We haven’t pushed these to classrooms yet, so it’s only been internal testing. We also plan to submit these for approval in the event you want to approve them now :slight_smile:

1 Like