Closed Bug 1231772 Opened 5 years ago Closed 5 months ago

embedLiveSamples that need attention


(Developer Documentation Graveyard :: General, defect)

Not set


(Not tracked)



(Reporter: shobson, Unassigned)



(2 files)

When the javascript tries to add the "open in codepen/jsfiddle" buttons to our live samples it sometimes encounters problems. We're now logging those problems in Google Analytics.

I've created a report that will auto-generate a list of pages with errors in the last 2 days:

In each of the cases I spot checked the "$sample was empty errors" and "$sample did not contain any code" are visible to the users as blank places on the page instead of live samples. "ajax error retrieving source" are an intermittent problems with the code and I'm trying to solve them.

The most common reason for a problem is that the live sample macro is looking for a heading ID that doesn't exist.

It would be great if we could make a dent in this list.

Notes about the report:
- the report re-runs once a day but it has 2 days of data so fixed samples will drop on the first day they're fixed but not disappear until the second day
- ga:pagePath is the page path with the problem
- ga:eventLabel is the ID of the heading that the script is looking for, the most common reason for an error is a miss match between the heading ID the script is looking for and the actual ID of the heading
- ga:eventAction is how often the error has been recorded, this is higher when the page is more popular
Ok, it looks like these are mostly wrong parameters to EmbedLiveSample.

Just fixed the first one (/en-US/docs/Web/API/EventTarget/addEventListener ) that covers about 20% of all events.
Just to record progress: we are at 584 errors.
Stephanie, I can't find a problem with these pages (I checked these over 4-5 days).

I never saw them with a live sample missing and they consistently appear in the list of errors.

Could you investigate what can cause this false positives? (There are likely more in the remaining results).
Flags: needinfo?(shobson)
I had a look at the false positives and I can't see anything wrong either :/ I'll have a better look but it might not be until I'm back from PTO on the 7th.
PeriodicSyncEvent and SyncEvent are using the InheritanceDiagram macro which draws an iframe with an SVG in it?!?! The iframe has the same classes as a live sample on it so the script which creates the live samples tries to add the buttons to the bottom of this macro and fails.

Probably we should have a discussion about what is trying to be accomplished here and what is needed. The SVG becomes unreadable on smaller screen sizes even though it has the space to remain readable on some of the pages where it is used (PeriodicSyncEvent for example though less so on InstallEvent). The same affect could probably be achieved with CSS and then we could have some media queries to make the diagram vertical on smaller screens.
Flags: needinfo?(shobson)
I think the problem on the CSS gradient page is that the code is expecting the samples to be separated by headings. I'll see if it's possible to modify it to look for <li>s as well.
Attached image Jean Yves is the best
I've poked at the ajax errors and am not able to reproduce but I was able to confirm that they're happening very infrequently on samples.

I'm going to try to improve the error messages to help diagnose but that will take a week or so to get into production and start feeding us data.
Er, infrequently on samples that are otherwise fine.
MDN Web Docs' bug reporting has now moved to GitHub. From now on, please file content bugs at and platform bugs at
Closed: 5 months ago
Resolution: --- → WONTFIX
You need to log in before you can comment on or make changes to this bug.