Skip to content

Commit ef41ee6

Browse files
author
Will Bamberg
committed
Merge remote-tracking branch 'upstream/master'
* upstream/master: (33 commits) Add HTML example for <a> (issue mdn#1014) (mdn#1022) fix(tabbed): load fonts as part of the editor css as @font-face does not work inside shadow dom (mdn#1015) html/input: Lowercase attributes (mdn#1024) Add color-adjust property example (mdn#1008) chore(deps): update dependency eslint to v5.1.0 (mdn#1023) chore(community): add @goodwin64 as contributor (mdn#1021) chore(community): add @dagolinuxoid as contributor (mdn#1020) chore(community): add @arai-a as contributor (mdn#1019) chore(community): add @ro-ka as contributor (mdn#1018) Issue mdn#1013 <style> elements in HTML editor break editor's render method (mdn#1017) chore(deps): update jest monorepo to v23.3.0 (mdn#1012) Issue#946 open links in new tab (mdn#1009) Send metric only during loading event (mdn#1011) fix(performance): only send loading mark inside loading event (mdn#1010) chore(deps): update dependency prettier to v1.13.7 (mdn#1006) fix(address): add name to the provided address (mdn#1004) chore(community): add @Arkangus as contributor (mdn#1002) Correct "expected output" mistake (mdn#1000) fix(performance): send post to kuma for custom ie-load-event-end metric (mdn#1001) chore(deps): update jest monorepo to v23.2.0 (mdn#993) ...
2 parents 0d3e838 + a10afcc commit ef41ee6

79 files changed

Lines changed: 2946 additions & 1687 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

.all-contributorsrc

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -398,6 +398,46 @@
398398
"https://avatars3.githubusercontent.com/u/16986422?s=460&v=4",
399399
"profile": "https://github.com/elharony",
400400
"contributions": ["code"]
401+
},
402+
{
403+
"login": "Arkangus",
404+
"name": "Arkangus",
405+
"avatar_url":
406+
"https://avatars3.githubusercontent.com/u/40596006?s=460&v=4",
407+
"profile": "https://github.com/Arkangus",
408+
"contributions": ["code"]
409+
},
410+
{
411+
"login": "ro-ka",
412+
"name": "Robert Katzki",
413+
"avatar_url":
414+
"https://avatars3.githubusercontent.com/u/840022?s=460&v=4",
415+
"profile": "https://github.com/ro-ka",
416+
"contributions": ["code"]
417+
},
418+
{
419+
"login": "arai-a",
420+
"name": "arai-a",
421+
"avatar_url":
422+
"https://avatars3.githubusercontent.com/u/6299746?s=460&v=4",
423+
"profile": "https://github.com/arai-a",
424+
"contributions": ["code"]
425+
},
426+
{
427+
"login": "dagolinuxoid",
428+
"name": "daGo",
429+
"avatar_url":
430+
"https://avatars3.githubusercontent.com/u/7243749?s=460&v=4",
431+
"profile": "https://github.com/dagolinuxoid",
432+
"contributions": ["code"]
433+
},
434+
{
435+
"login": "goodwin64",
436+
"name": "Max Donchenko",
437+
"avatar_url":
438+
"https://avatars3.githubusercontent.com/u/10671879?s=460&v=4",
439+
"profile": "https://github.com/goodwin64",
440+
"contributions": ["code"]
401441
}
402442
]
403443
}

CONTRIBUTING-HTML.md

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -163,6 +163,18 @@ thead {
163163

164164
Follow the [mdn-fiori CSS formatting guidelines](https://mdn.github.io/mdn-fiori/patterns/css/formatting/).
165165

166+
### Fonts
167+
168+
Because the editor uses Shadow DOM to isolate the example, you can't use `@font-face` to include extra fonts in your example. We've included a number of extra fonts in the [shadow-fonts.css](https://github.com/mdn/interactive-examples/blob/master/css/editor-libs/shadow-fonts.css) file, and you can use these with a normal `font-family` declaration:
169+
170+
```
171+
p {
172+
font-family: 'molot';
173+
}
174+
```
175+
176+
If you need to include some additional fonts, add them to your pull request and update the "shadow-fonts.css" file to include them.
177+
166178
## Updating the metadata
167179

168180
In "live-examples/html-examples/table-content/" you'll need a file called "meta.json". This tells the site builder about the examples inside the directory. If it doesn't exist, create it. If it does, open it,

README.md

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,6 @@ If you're interested in contributing to this project, great! Please see the [CON
4545
Thanks goes to these wonderful people ([emoji key](https://github.com/kentcdodds/all-contributors#emoji-key)):
4646

4747
<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
48-
4948
<!-- prettier-ignore -->
5049
| [<img src="https://avatars3.githubusercontent.com/u/10350960?s=460&v=4" width="100px;"/><br /><sub><b>Schalk Neethling</b></sub>](https://github.com/schalkneethling)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=schalkneethling "Code") [📖](https://github.com/mdn/interactive-examples/commits?author=schalkneethling "Documentation") [⚠️](https://github.com/mdn/interactive-examples/commits?author=schalkneethling "Tests") | [<img src="https://avatars3.githubusercontent.com/u/208756?s=460&v=4" width="100px;"/><br /><sub><b>Mark Boas</b></sub>](https://github.com/maboa)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=maboa "Code") [📖](https://github.com/mdn/interactive-examples/commits?author=maboa "Documentation") | [<img src="https://avatars3.githubusercontent.com/u/432915?s=460&v=4" width="100px;"/><br /><sub><b>William Bamberg</b></sub>](https://github.com/wbamberg)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=wbamberg "Code") [📖](https://github.com/mdn/interactive-examples/commits?author=wbamberg "Documentation") | [<img src="https://avatars3.githubusercontent.com/u/854701?s=460&v=4" width="100px;"/><br /><sub><b>Stephanie Hobson</b></sub>](https://github.com/stephaniehobson)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=stephaniehobson "Code") | [<img src="https://avatars3.githubusercontent.com/u/161718?s=460&v=4" width="100px;"/><br /><sub><b>Josh Mize</b></sub>](https://github.com/jgmize)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=jgmize "Code") | [<img src="https://avatars3.githubusercontent.com/u/47647?s=460&v=4" width="100px;"/><br /><sub><b>Chris Mills</b></sub>](https://github.com/chrisdavidmills)<br />[📖](https://github.com/mdn/interactive-examples/commits?author=chrisdavidmills "Documentation") [💻](https://github.com/mdn/interactive-examples/commits?author=chrisdavidmills "Code") | [<img src="https://avatars3.githubusercontent.com/u/58244?s=460&v=4" width="100px;"/><br /><sub><b>Dave Parfitt</b></sub>](https://github.com/metadave)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=metadave "Code") |
5150
| :---: | :---: | :---: | :---: | :---: | :---: | :---: |
@@ -55,7 +54,7 @@ Thanks goes to these wonderful people ([emoji key](https://github.com/kentcdodds
5554
| [<img src="https://avatars3.githubusercontent.com/u/12428444?s=460&v=4" width="100px;"/><br /><sub><b>Mathias Arens</b></sub>](https://github.com/tatellos)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=tatellos "Code") | [<img src="https://avatars3.githubusercontent.com/u/347244?s=460&v=4" width="100px;"/><br /><sub><b>Clément P</b></sub>](https://github.com/yukulele)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=yukulele "Code") | [<img src="https://avatars3.githubusercontent.com/u/2515134?s=460&v=4" width="100px;"/><br /><sub><b>Patrick Lienau</b></sub>](https://github.com/rozzzly)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=rozzzly "Code") | [<img src="https://avatars3.githubusercontent.com/u/2784308?s=460&v=4" width="100px;"/><br /><sub><b>yisibl</b></sub>](https://github.com/yisibl)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=yisibl "Code") | [<img src="https://avatars3.githubusercontent.com/u/2294248?s=460&v=4" width="100px;"/><br /><sub><b>Ian Sanders</b></sub>](https://github.com/iansan5653)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=iansan5653 "Code") | [<img src="https://avatars3.githubusercontent.com/u/18094289?s=460&v=4" width="100px;"/><br /><sub><b>Nikolay Puzyrev</b></sub>](https://github.com/npuzyrev)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=npuzyrev "Code") | [<img src="https://avatars3.githubusercontent.com/u/1028647?s=460&v=4" width="100px;"/><br /><sub><b>Marek Pepke</b></sub>](https://github.com/pepkin88)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=pepkin88 "Code") |
5655
| [<img src="https://avatars3.githubusercontent.com/u/8886118?s=460&v=4" width="100px;"/><br /><sub><b>Rudz Boy</b></sub>](https://github.com/rudzboy)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=rudzboy "Code") | [<img src="https://avatars3.githubusercontent.com/u/1280142?s=460&v=4" width="100px;"/><br /><sub><b>Simon Wörner</b></sub>](https://github.com/SWW13)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=SWW13 "Code") | [<img src="https://avatars3.githubusercontent.com/u/193881?s=460&v=4" width="100px;"/><br /><sub><b>Martijn Thé</b></sub>](https://github.com/martijnthe)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=martijnthe "Code") | [<img src="https://avatars3.githubusercontent.com/u/20806640?s=460&v=4" width="100px;"/><br /><sub><b>Abhishek</b></sub>](https://github.com/Abhicoding)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=Abhicoding "Code") | [<img src="https://avatars3.githubusercontent.com/u/1461498?s=460&v=4" width="100px;"/><br /><sub><b>Chen Hui Jing</b></sub>](https://github.com/huijing)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=huijing "Code") | [<img src="https://avatars3.githubusercontent.com/u/4010828?s=460&v=4" width="100px;"/><br /><sub><b>Mats Palmgren</b></sub>](https://github.com/MatsPalmgren)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=MatsPalmgren "Code") | [<img src="https://avatars3.githubusercontent.com/u/349114?s=460&v=4" width="100px;"/><br /><sub><b>Florian Scholz</b></sub>](https://github.com/Elchi3)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=Elchi3 "Code") |
5756
| [<img src="https://avatars3.githubusercontent.com/u/4089035?s=460&v=4" width="100px;"/><br /><sub><b>Adilson Sandoval</b></sub>](https://github.com/2alin)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=2alin "Code") | [<img src="https://avatars3.githubusercontent.com/u/1641439?s=460&v=4" width="100px;"/><br /><sub><b>Eric Shepherd</b></sub>](https://github.com/a2sheppy)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=a2sheppy "Code") | [<img src="https://avatars3.githubusercontent.com/u/305414?s=460&v=4" width="100px;"/><br /><sub><b>Leonard Lee</b></sub>](https://github.com/sheeeng)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=sheeeng "Code") | [<img src="https://avatars3.githubusercontent.com/u/9104039?s=460&v=4" width="100px;"/><br /><sub><b>Théis Bazin</b></sub>](https://github.com/tbazin)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=tbazin "Code") | [<img src="https://avatars3.githubusercontent.com/u/4323265?s=460&v=4" width="100px;"/><br /><sub><b>Neha Nupoor</b></sub>](https://github.com/nnupoor)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=nnupoor "Code") | [<img src="https://avatars3.githubusercontent.com/u/334191?s=460&v=4" width="100px;"/><br /><sub><b>Stephan Max</b></sub>](https://github.com/stephanmax)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=stephanmax "Code") | [<img src="https://avatars3.githubusercontent.com/u/1336590?s=460&v=4" width="100px;"/><br /><sub><b>Christian Stuff</b></sub>](https://github.com/Regaddi)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=Regaddi "Code") |
58-
| [<img src="https://avatars3.githubusercontent.com/u/16986422?s=460&v=4" width="100px;"/><br /><sub><b>Yahya Elharony</b></sub>](https://github.com/elharony)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=elharony "Code") |
57+
| [<img src="https://avatars3.githubusercontent.com/u/16986422?s=460&v=4" width="100px;"/><br /><sub><b>Yahya Elharony</b></sub>](https://github.com/elharony)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=elharony "Code") | [<img src="https://avatars3.githubusercontent.com/u/40596006?s=460&v=4" width="100px;"/><br /><sub><b>Arkangus</b></sub>](https://github.com/Arkangus)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=Arkangus "Code") | [<img src="https://avatars3.githubusercontent.com/u/840022?s=460&v=4" width="100px;"/><br /><sub><b>Robert Katzki</b></sub>](https://github.com/ro-ka)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=ro-ka "Code") | [<img src="https://avatars3.githubusercontent.com/u/6299746?s=460&v=4" width="100px;"/><br /><sub><b>arai-a</b></sub>](https://github.com/arai-a)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=arai-a "Code") | [<img src="https://avatars3.githubusercontent.com/u/7243749?s=460&v=4" width="100px;"/><br /><sub><b>daGo</b></sub>](https://github.com/dagolinuxoid)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=dagolinuxoid "Code") | [<img src="https://avatars3.githubusercontent.com/u/10671879?s=460&v=4" width="100px;"/><br /><sub><b>Max Donchenko</b></sub>](https://github.com/goodwin64)<br />[💻](https://github.com/mdn/interactive-examples/commits?author=goodwin64 "Code") |
5958
<!-- ALL-CONTRIBUTORS-LIST:END -->
6059

6160
This project follows the [all-contributors](https://github.com/kentcdodds/all-contributors) specification. Contributions of any kind welcome!

css/editor-libs/shadow-fonts.css

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
/* fonts used by the examples rendered inside the shadow dom. Because
2+
@font-face does not work in shadow dom:
3+
http://robdodson.me/at-font-face-doesnt-work-in-shadow-dom/ */
4+
@font-face {
5+
font-family: 'Fira Sans';
6+
src: local('FiraSans-Regular'),
7+
url('/media/fonts/FiraSans-Regular.woff2') format('woff2');
8+
}
9+
10+
@font-face {
11+
font-family: 'Fira Sans';
12+
font-weight: normal;
13+
font-style: oblique;
14+
src: local('FiraSans-SemiBoldItalic'),
15+
url('/media/fonts/FiraSans-SemiBoldItalic.woff2');
16+
}
17+
18+
@font-face {
19+
font-family: 'Dancing Script';
20+
src: url(/media/fonts/DancingScript-Regular.ttf);
21+
}
22+
23+
@font-face {
24+
font-family: 'molot';
25+
src: url('/media/fonts/molot.woff2') format('woff2');
26+
}
27+
28+
@font-face {
29+
font-family: 'rapscallion';
30+
src: url('/media/fonts/rapscall.woff2') format('woff2');
31+
}

js/editable-css.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -103,6 +103,8 @@
103103
'CSS editor load time',
104104
performance.timing.loadEventEnd
105105
);
106+
// Posts mark to set on the Kuma side and used in measure
107+
mceUtils.postToKuma({ markName: 'css-ie-load-event-end' });
106108
}, 100);
107109
}
108110
});

js/editable-js.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
var featureDetector = require('./editor-libs/feature-detector.js');
55
var mceConsole = require('./editor-libs/console');
66
var mceEvents = require('./editor-libs/events.js');
7+
var mceUtils = require('./editor-libs/mce-utils');
78

89
var codeBlock = document.getElementById('static-js');
910
var exampleFeature = codeBlock.dataset['feature'];
@@ -116,7 +117,9 @@
116117
'JS editor load time',
117118
performance.timing.loadEventEnd
118119
);
119-
}, 100);
120+
// Posts mark to set on the Kuma side and used in measure
121+
mceUtils.postToKuma({ markName: 'js-ie-load-event-end' });
122+
}, 300);
120123
}
121124
});
122125
}

js/editor-libs/analytics.js

Lines changed: 0 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -22,41 +22,6 @@ module.exports = {
2222
label: 'Interaction Events'
2323
});
2424
},
25-
/**
26-
* Creates an object that is passed to trackEvent, recording
27-
* the users first edit event.
28-
* @param {String} exampleType - One of js or css
29-
*/
30-
trackFirstEdit: function(exampleType) {
31-
'use strict';
32-
this.trackEvent({
33-
category: 'Interactive Example - ' + exampleType,
34-
action: 'First edit',
35-
label: 'Keyboard Interaction Events'
36-
});
37-
38-
try {
39-
// store a flag that first edit has been recorded
40-
localStorage.setItem(
41-
'first' + exampleType.toUpperCase() + 'EditRecorded',
42-
true
43-
);
44-
} catch (e) {} // eslint-disable-line no-empty
45-
},
46-
/**
47-
* Sends the duration from `navigationStart` until `onload` to GA
48-
* in order to measure performance
49-
* @param {String} exampleType - One of js or css
50-
* @param {int} duration - The time it took for the editor to load
51-
*/
52-
trackFrameLoadTime: function(exampleType, duration) {
53-
'use strict';
54-
this.trackEvent({
55-
category: 'Interactive Example - ' + exampleType,
56-
action: 'Load time in ms: ' + duration,
57-
label: 'Performance'
58-
});
59-
},
6025
/**
6126
* Creates an object that is passed to trackEvent, recording
6227
* the clicks on the JS examples run button.

js/editor-libs/events.js

Lines changed: 0 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -20,12 +20,6 @@ function addCSSEditorEventListeners(exampleChoiceList) {
2020
exampleChoiceParent.textContent,
2121
exampleChoiceParent
2222
);
23-
24-
try {
25-
if (!localStorage.getItem('firstCSSEditRecorded')) {
26-
mceAnalytics.trackFirstEdit('css');
27-
}
28-
} catch (e) {} // eslint-disable-line no-empty
2923
});
3024

3125
exampleChoiceList.addEventListener('click', function(event) {
@@ -62,14 +56,6 @@ function addJSEditorEventListeners(liveEditor) {
6256
mceAnalytics.trackRunClicks();
6357
}
6458
});
65-
66-
liveEditor.addEventListener('keyup', function() {
67-
try {
68-
if (!localStorage.getItem('firstJSEditRecorded')) {
69-
mceAnalytics.trackFirstEdit('js');
70-
}
71-
} catch (e) {} // eslint-disable-line no-empty
72-
});
7359
}
7460

7561
/**
@@ -168,22 +154,6 @@ function handlePasteEvents(event) {
168154
Prism.highlightElement(parentCodeElem);
169155
}
170156

171-
/**
172-
* Binds an event to the `window` object and listens for the onload event.
173-
* When the event is fired, the iframe load time is calculated, and the result
174-
* passed on to `trackFrameLoadTime` for performance analytics.
175-
* @param {String} exampleType - One of js or css
176-
*/
177-
function sendPerformanceMetric(exampleType) {
178-
'use strict';
179-
window.onload = function sendLoadTime() {
180-
mceAnalytics.trackFrameLoadTime(
181-
exampleType,
182-
mceUtils.calculateFrameLoadTime()
183-
);
184-
};
185-
}
186-
187157
module.exports = {
188158
/**
189159
* Called when a new `example-choice` has been selected.
@@ -222,12 +192,10 @@ module.exports = {
222192
// only bind events if the `exampleChoiceList` container exist
223193
if (exampleChoiceList) {
224194
addPostMessageListener();
225-
sendPerformanceMetric('css');
226195
addCSSEditorEventListeners(exampleChoiceList);
227196
}
228197

229198
if (liveEditor) {
230-
sendPerformanceMetric('js');
231199
addJSEditorEventListeners(liveEditor);
232200
}
233201
},

js/editor-libs/mce-utils.js

Lines changed: 35 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,4 @@
11
module.exports = {
2-
/**
3-
* Calculates the perceived load time of the iframe using
4-
* the Navigation Timing API
5-
*/
6-
calculateFrameLoadTime: function() {
7-
'use strict';
8-
var loadTime = 'Not supported';
9-
var now = new Date().getTime();
10-
11-
if (performance.timing !== undefined) {
12-
loadTime = now - performance.timing.navigationStart;
13-
}
14-
15-
return loadTime;
16-
},
172
/**
183
* Find and return the `example-choice` parent of the provided element
194
* @param {Object} element - The child element for which to find the
@@ -52,6 +37,41 @@ module.exports = {
5237

5338
return tmpElem.style[property] !== undefined;
5439
},
40+
/**
41+
* Interrupts the default click event on external links inside
42+
* the shadow dom and opens them in a new tab instead
43+
* @param {Array} externalLinks - all external links inside the shadow dom
44+
*/
45+
openLinksInNewTab: function(externalLinks) {
46+
externalLinks.forEach(function(externalLink) {
47+
externalLink.addEventListener('click', function(event) {
48+
event.preventDefault();
49+
window.open(externalLink.href);
50+
});
51+
});
52+
},
53+
/**
54+
* Posts a name to set as a mark to Kuma for
55+
* processing and beaconing to GA
56+
* @param {Object} perf - The performance object sent to Kuma
57+
*/
58+
postToKuma: function(perf) {
59+
window.parent.postMessage(perf, 'https://developer.mozilla.org');
60+
},
61+
/**
62+
* Interrupts the default click event on relative links inside
63+
* the shadow dom and scrolls to the targeted anchor
64+
* @param {Object} shadow - the shadow dom root
65+
* @param {Array} relativeLinks - all relative links inside the shadow dom
66+
*/
67+
scrollToAnchors: function(shadow, relativeLinks) {
68+
relativeLinks.forEach(function(relativeLink) {
69+
relativeLink.addEventListener('click', function(event) {
70+
event.preventDefault();
71+
shadow.querySelector(relativeLink.hash).scrollIntoView();
72+
});
73+
});
74+
},
5575
/**
5676
* Hides the default example and shows the custom block
5777
* @param {object} customBlock - The HTML section to show

0 commit comments

Comments
 (0)