Learning web development: Marking guides and questions

Can someone help me with the code? It is at Active learning: More color choices! https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/conditionals. Below is my code to change the bgColor and textColor. I cannot figure out the error but the code does not work though…

// ADD SWITCH STATEMENT
switch(choice) {
case ‘white’:
update(‘white’, ‘red’);
break;
case ‘black’:
update(‘black’, ‘yellow’);
break;
case ‘purple’:
update( ‘purple’, ‘black’);
break;
case ‘Psychedelic’:
update( ‘grey’, ‘blue’);
break;
case ‘Yellow’:
update(‘yellow’,‘pink)’;
break;
}
}

It might be because you have the last couple of cases written out with capital letters at the start; JavaScript is case-sensitive.

It is worth going back to the “Active learning: More color choices!” section and click on the “Show solution” button to see our final code.

I am attempting to edit the learning exercises and Chrome 79/MacOS 10.13.6
Page hangs with error…

“paused in debugger”

URL:

  1. Filtering greeting messages - exercise

// reload page…
// click to edit javascript and type 1 character
// Error: paused in debugger
// Large grey rectangle on screen
// Can not edit
// reset and show solution buttons do not work.

  1. Making new strings from old parts - excercise

// reload page…
// click to edit javascript and type 1 character
// Error: paused in debugger
// Large grey rectangle on screen
// Can not edit
// reset and show solution buttons do not work.

hth,

CK

Works in Firefox 71 !

hth,

CK

Hi @C_K_Ashby; this seems to work for me, in Chrome and Firefox.

Did this occur with any edit of the code, or when you made a specific change? it would be possible to create an infinite loop in the JS, which probably crash it :wink:

Working now. Very strange.

I have a new bug and will create a new post.

Working on the Promises tutorial.
Chrome 79/MacOS 10.13.6

" Explaining basic promise syntax"

// Very first script command errors. CORS.

// The support page linked to the console error…

" In response to CVE-2019-11730, Firefox 68 and later define the origin of a page opened using a file:/// URI as unique. Therefore, other resources in the same directory or its subdirectories no longer satisfy the CORS same-origin rule. This new behavior is enabled by default using the privacy.file_unique_origin preference."

Of course, if I just use imageRef.src = “coffee.jpg” . // No fetch. It works.

Does the tutorial need an update?

Mahalo,

C K

full code below.

Promises

Promises

My page

// Works fine with https://placekitten

let promise = fetch(“https://placekitten.com/200/300”);

hth,

CK

The example won’t work if you run it locally (i.e. through a file:// URL). I’ve added a note to make this clear, and offer solutions to get it running.

Of course, if I just use imageRef.src = “coffee.jpg” . // No fetch. It works.

I appreciate this, and I do talk about this in a note near the bottom of the example section. Thing is though, I chose this example because it demonstrates promises in a simple fashion, understandable by beginners, with immediate visual feedback when it’s worked. It is actually quite hard to come up with a real world promises example that is simple enough for beginners to understand it. Promises are really quite complicated.

I am reading…

There are several instances of —

WAI-ARIA

Would you please add a title attribute to the abbr element?

Set title=“Accessible Rich Internet Applications” so there will be a tooltip to explain the acronym.

Cheers,

C K

I’ve added the expansion once in parens, after the first instance in the article. I didn’t add it everywhere, as I didn’t think it was that useful really - it’s a big jumble of words :wink:

I also prefer putting expansions directly in the page rather than in <abbr> elements, as I think it is better for accessibility.

I was thinking more about the “WAI-ARIA” link on the first line of the “Enter WAI-ARIA” paragraph.

I believe screen readers will speak the title=“text” and let listeners know what page the link connects to. The tooltip is just bonus.

All the other links in the “Roles” paragraph have tooltips.

hth,

C K

Bad URL for sample video…

YouTube Error: Video unavailable

take a look at Audio Transcription Sample 1 and choose More >

Bad link to brightcove…

Using the Flash-Only Player API for Closed Captioning,

Error: Page Not Found

From my experience, it is not consistent across screenreaders. I’ve moved the expansion to where you suggested, as I think it is a better place.

Bad link to brightcove…

I’ve found a link that works, and put that one on there instead.

I’ve fixed this too - thanks for reporting these!

Are you notified when I edit the Wiki?

C K

Android issue…

To turn it on, select Settings > Accessibility > TalkBack

Android 8.1
Settings / Accessibility / TalkBack

// Good for older phones

Newer than Android 8.1
Settings / General (tab) / Accessibility / Vision / TalkBack

// Not what I would call an improvement :wink:

To turn TalkBack off…

Navigate to Accessibility > TalkBack .

// Your call

Depends what page you are editing. I watch the whole of the MDN /Learn/ tree, so I’ll get emailed if you make changes there.

I am happy for you to make these fixes yourself in future, although I’ll make the ones you’ve already reported.