diff --git a/public/stage1/tests.js b/public/stage1/tests.js
index 46f1ed45..c1bfc95b 100644
--- a/public/stage1/tests.js
+++ b/public/stage1/tests.js
@@ -12,7 +12,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
// 'change me!' を document.getElementById(elementId) に
// 書き換え、ブラウザをリロードしてみてください。
var elementId = 'firebrick';
- var element = 'change me!';
+ var element = document.getElementById(elementId);
expect(element).to.be.instanceof(HTMLElement);
expect(element).to.have.property('id', elementId);
@@ -27,7 +27,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
// 'change me!' を書き換えてください。
var elementId = 'chocolate';
- var element = 'change me!';
+ var element = document.getElementById(elementId);
expect(element).to.be.instanceof(HTMLElement);
expect(element).to.have.property('id', elementId);
@@ -41,7 +41,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
// 'change me!' を書き換えてください。
var elementClassName = 'mediumseagreen';
- var elements = 'change me!';
+ var elements = document.getElementsByClassName(elementClassName);
expect(elements).to.have.length(1);
expect(elements[0]).to.have.property('className', elementClassName);
@@ -55,7 +55,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
// 'change me!' を書き換えてください。
var elementClassName = 'turquoise';
- var elements = 'change me!';
+ var elements = document.getElementsByClassName(elementClassName);
expect(elements).to.have.length(2);
expect(elements[0]).to.have.property('className', elementClassName);
@@ -70,7 +70,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
// 'change me!' を書き換えてください。
var elementTagName = 'blockquote';
- var elements = 'change me!';
+ var elements = document.getElementsByTagName(elementTagName);
expect(elements).to.have.length(1);
expect(elements[0]).to.have.property('tagName', elementTagName.toUpperCase());
@@ -93,7 +93,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
// すると、開発ツール上で
... が選択されます。
// このことから、7 番の赤色の要素の ID は brown だということがわかります。
// では、'change me!' を document.getElementById('brown') に書き換えてみましょう。
- var element = 'change me!';
+ var element = document.getElementById('brown');
expect(element).to.have.property(secret('vq'), secret('oebja'));
});
@@ -102,7 +102,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
it('8 番の橙色の要素が1つ取得できる', function() {
// 'change me!' を書き換えてください。
- var element = 'change me!';
+ var element = document.getElementById('darkorange');
expect(element).to.have.property(secret('vq'), secret('qnexbenatr'));
});
@@ -111,7 +111,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
it('9 番の緑色の要素が1つ取得できる', function() {
// 'change me!' を書き換えてください。
- var elements = 'change me!';
+ var elements = document.getElementsByClassName('limegreen');
expect(elements).to.have.length(1);
expect(elements[0]).to.have.property(secret('pynffAnzr'), secret('yvzrterra'));
@@ -121,7 +121,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
it('10 番の水色の要素が2つ取得できる', function() {
// 'change me!' を書き換えてください。
- var elements = 'change me!';
+ var elements = document.getElementsByClassName('mediumturquoise');
expect(elements).to.have.length(2);
expect(elements[0]).to.have.property(secret('pynffAnzr'), secret('zrqvhzghedhbvfr'));
@@ -135,7 +135,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
//
// なお、11 番の青色の要素は li 要素ではありません!
// よくみると、色がついているのはさらに内側の要素のようです。
- var elements = 'change me!';
+ var elements = document.getElementsByTagName('p');
expect(elements).to.have.length(1);
expect(elements[0]).to.have.property(secret('gntAnzr'), secret('C'));
@@ -152,7 +152,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
//
// 'change me!' を document.querySelector('#firebrick') に
// 書き換えてください。
- var element = 'change me!';
+ var element = document.querySelector('#firebrick');
expect(element).to.have.property(secret('vq'), secret('sveroevpx'));
@@ -164,7 +164,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
it('2 番の橙色の要素を querySelector を使って1つ取得できる', function() {
// 'change me!' を書き換えてください。
- var element = 'change me!';
+ var element = document.querySelector('#chocolate');
expect(element).to.have.property(secret('vq'), secret('pubpbyngr'));
@@ -176,7 +176,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
it('3 番の緑色の要素を querySelector を使って1つ取得できる', function() {
// 'change me!' を書き換えてください。
- var element = 'change me!';
+ var element = document.querySelector('.mediumseagreen');
expect(element).to.have.property(secret('pynffAnzr'), secret('zrqvhzfrnterra'));
});
@@ -185,7 +185,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
it('4 番の水色の要素を querySelectorAll を使って2つ取得できる', function() {
// 'change me!' を書き換えてください。
- var elements = 'change me!';
+ var elements = document.querySelectorAll('.turquoise');
expect(elements).to.have.length(2);
expect(elements[0]).to.have.property(secret('pynffAnzr'), secret('ghedhbvfr'));
@@ -196,7 +196,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
it('5 番の青色の要素を querySelector を使って1つ取得できる', function() {
// 'change me!' を書き換えてください。
- var element = 'change me!';
+ var element = document.querySelector('blockquote');
expect(element).to.have.property(secret('gntAnzr'), secret('OYBPXDHBGR'));
});
@@ -205,7 +205,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
it('6 番の紫色の要素を querySelector を使って1つ取得できる', function() {
// 'change me!' を書き換えてください。
- var element = 'change me!';
+ var element = document.querySelector('[title="blueviolet"]');
expect(element).to.have.deep.property(secret('qngnfrg.wfGenvavat'),
secret('oyhrivbyrg'));
@@ -220,7 +220,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
//
// 'change me!' を '.js-training:nth-child(2) li'
// に書き換えてください。
- var selector = 'change me!';
+ var selector = '.js-training:nth-child(2) li';
var element = document.querySelector(selector);
expect(selector).to.not.have.string('#');
@@ -231,7 +231,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
it('8 番の橙色の要素を ID セレクタを使わずに1つ取得できる', function() {
// 'change me!' を書き換えてください。
- var selector = 'change me!';
+ var selector = '.js-training:nth-child(2) li:nth-child(2)';
var element = document.querySelector(selector);
expect(selector).to.not.have.string('#');
@@ -245,7 +245,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
it('12 番の紫色の要素を、属性セレクタと :nth-child(N) セレクタを使わずに1つ取得できる', function() {
// 'change me!' を書き換えてください。
- var selector = 'change me!';
+ var selector = 'ul + .js-training li:last-child';
var element = document.querySelector(selector);
expect(selector).to.not.match(/\[\s*name\s*[~\|\^\$\*]?=/);
@@ -265,7 +265,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
// 基本的な使い方は document.querySelectorAll と同じです。
//
// 'change me!' を $('#brown') に書き換えてください。
- var $element = 'change me!';
+ var $element = $('#brown');
expect($element).to.be.instanceof(jQuery);
expect($element).to.have.id(secret('oebja'));
@@ -275,7 +275,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
it('8 番の橙色の要素を jQuery を使って1つ取得できる', function() {
// 'change me!' を書き換えてください。
- var $element = 'change me!';
+ var $element = $('#darkorange');
expect($element).to.be.instanceof(jQuery);
expect($element).to.have.id(secret('qnexbenatr'));
@@ -288,7 +288,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
it('9 番の緑色の要素を jQuery を使って1つ取得できる', function() {
// 'change me!' を書き換えてください。
- var $element = 'change me!';
+ var $element = $('.limegreen');
expect($element).to.be.instanceof(jQuery);
expect($element).to.have.class(secret('yvzrterra'));
@@ -298,7 +298,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
it('10 番の水色の要素を jQuery を使って2つ取得できる', function() {
// 'change me!' を書き換えてください。
- var $element = 'change me!';
+ var $element = $('.mediumturquoise');
expect($element).to.be.instanceof(jQuery);
expect($element).to.have.length(2);
@@ -309,7 +309,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
it('11 番の青色の要素を jQuery を使って1つ取得できる', function() {
// 'change me!' を書き換えてください。
- var $element = 'change me!';
+ var $element = $('ul + .js-training li:nth-last-child(2) > p');
expect($element).to.be.instanceof(jQuery);
expect($element).to.have.length(1);
@@ -320,7 +320,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
it('12 番の紫色の要素を jQuery を使って1つ取得できる', function() {
// 'change me!' を書き換えてください。
- var $element = 'change me!';
+ var $element = $('ul + .js-training li:last-child');
expect($element).to.be.instanceof(jQuery);
expect($element).to.have.length(1);
@@ -334,7 +334,7 @@ describe('ステージ1(意図した DOM 要素を取得できるようにな
it('動いている寿司要素を取得する', function() {
// 'change me!' を書き換えてください。
- var element = 'change me!';
+ var element = document.querySelector('[style*="animation"]');
expect(element).to.have.deep.property(
secret('grkgPbagrag'), '\uD83C\uDF63');
diff --git a/public/stage2/tests.js b/public/stage2/tests.js
index b430dfdc..8caf4bc6 100644
--- a/public/stage2/tests.js
+++ b/public/stage2/tests.js
@@ -11,7 +11,8 @@ describe('ステージ2(意図した通りに DOM 要素の属性・テキス
//
// var element = document.getElementById('firebrick');
// element.textContent = element.textContent + element.textContent;
- var element = 'change me!';
+ var element = document.getElementById('firebrick');
+ element.textContent = element.textContent + element.textContent;
expect(element).to.have.property(secret('vq'), secret('sveroevpx'));
@@ -24,7 +25,8 @@ describe('ステージ2(意図した通りに DOM 要素の属性・テキス
// ここにコードを記述してください。
// 変更した DOM 要素は element 変数に代入してください。
- var element = 'change me!';
+ var element = document.getElementById('chocolate');
+ element.textContent = element.textContent + element.textContent;
expect(element).to.have.property(secret('vq'), secret('pubpbyngr'));
@@ -40,7 +42,8 @@ describe('ステージ2(意図した通りに DOM 要素の属性・テキス
// ここにコードを記述してください。
// 変更した DOM 要素は element 変数に代入してください。
- var element = 'change me!';
+ var element = document.querySelector('.mediumseagreen');
+ element.style.backgroundColor = 'limegreen';
expect(element).to.have.property(
@@ -58,7 +61,8 @@ describe('ステージ2(意図した通りに DOM 要素の属性・テキス
// ここにコードを記述してください。
// 変更した DOM 要素は element 変数に代入してください。
- var element = 'change me!';
+ var element = document.querySelector('.turquoise');
+ element.style.opacity = '0.5';
expect(element).to.have.property(
@@ -76,7 +80,8 @@ describe('ステージ2(意図した通りに DOM 要素の属性・テキス
// ここにコードを記述してください。
// 変更した DOM 要素は element 変数に代入してください。
- var element = 'change me!';
+ var element = document.querySelector('blockquote');
+ element.style.transform = 'rotate(10deg)';
expect(element).to.have.property(
@@ -97,7 +102,9 @@ describe('ステージ2(意図した通りに DOM 要素の属性・テキス
//
// なお、上に 20px 移動させる方法は複数ありますが、今回は top 属性を
// 使う方法を使ってください。
- var element = 'change me!';
+ var element = document.querySelector('[data-js-training="blueviolet"]');
+ element.style.position = 'relative';
+ element.style.top = '-20px';
expect(element).to.have.deep.property(
@@ -127,7 +134,8 @@ describe('ステージ2(意図した通りに DOM 要素の属性・テキス
//
// var $element = $('#brown');
// $element.text($element.text() + $element.text());
- var $element = 'change me!';
+ var $element = $('#brown');
+ $element.text($element.text() + $element.text());
expect($element).to.be.instanceof(jQuery);
@@ -140,7 +148,8 @@ describe('ステージ2(意図した通りに DOM 要素の属性・テキス
// ここにコードを記述してください。
// 変更した DOM 要素は $element 変数に代入してください。
- var $element = 'change me!';
+ var $element = $('#darkorange');
+ $element.text($element.text() + $element.text());
expect($element).to.be.instanceof(jQuery);
@@ -156,7 +165,8 @@ describe('ステージ2(意図した通りに DOM 要素の属性・テキス
// ここにコードを記述してください。
// 変更した DOM 要素は $element 変数に代入してください。
- var $element = 'change me!';
+ var $element = $('.limegreen');
+ $element.css('background-color', 'mediumseagreen');
expect($element).to.be.instanceof(jQuery);
@@ -173,7 +183,8 @@ describe('ステージ2(意図した通りに DOM 要素の属性・テキス
// ここにコードを記述してください。
// 変更した DOM 要素は $element 変数に代入してください。
- var $element = 'change me!';
+ var $element = $('.mediumturquoise');
+ $element.css('opacity', '0.5');
expect($element).to.be.instanceof(jQuery);
@@ -186,7 +197,8 @@ describe('ステージ2(意図した通りに DOM 要素の属性・テキス
// ここにコードを記述してください。
// 変更した DOM 要素は $element 変数に代入してください。
- var $element = 'change me!';
+ var $element = $('.js-training p');
+ $element.css('transform', 'rotate(10deg)');
expect($element).to.be.instanceof(jQuery);
@@ -205,7 +217,8 @@ describe('ステージ2(意図した通りに DOM 要素の属性・テキス
//
// なお、上に 20px 移動させる方法は複数ありますが、今回は top 属性を
// 使う方法を使ってください。
- var $element = 'change me!';
+ var $element = $('[data-js-training="darkorchid"]');
+ $element.css({'position': 'relative', 'top': '-20px'});
expect($element).to.be.instanceof(jQuery);
diff --git a/public/stage3/tests.js b/public/stage3/tests.js
index fa3cb6f2..d6f55dbe 100644
--- a/public/stage3/tests.js
+++ b/public/stage3/tests.js
@@ -11,6 +11,9 @@ describe('ステージ3(意図した通りに DOM 要素の構造を変更で
// var element = document.querySelector('#firebrick');
// var ghost = document.querySelector('.firebrick-ghost');
// element.removeChild(ghost);
+ var element = document.querySelector('#firebrick');
+ var ghost = document.querySelector('.firebrick-ghost');
+ element.removeChild(ghost);
var firebrick = document.getElementById('firebrick');
@@ -22,6 +25,9 @@ describe('ステージ3(意図した通りに DOM 要素の構造を変更で
it('2 番の要素からインベーダー要素を除去する', function() {
// ここにコードを記述してください。
+ var element = document.querySelector('#chocolate');
+ var invader = document.querySelector('.chocolate-space-invader');
+ element.removeChild(invader);
var darkorange = document.getElementById('chocolate');
@@ -33,6 +39,10 @@ describe('ステージ3(意図した通りに DOM 要素の構造を変更で
it('3 番の要素の左右の幽霊要素をすべて除去する', function() {
// ここにコードを記述してください。
+ var element = document.querySelector('.mediumseagreen');
+ var ghosts = document.querySelectorAll('.mediumseagreen-ghosts');
+ element.removeChild(ghosts[0]);
+ element.removeChild(ghosts[1]);
var darkorange = document.querySelector('.mediumseagreen');
@@ -45,6 +55,8 @@ describe('ステージ3(意図した通りに DOM 要素の構造を変更で
elementToAdd.textContent = '\uD83D\uDC2C';
// 上の elementToAdd を追加するコードをここに記述してください。
+ var element = document.querySelector('.turquoise');
+ element.appendChild(elementToAdd);
var turquoise = document.querySelector('.turquoise');
@@ -60,6 +72,8 @@ describe('ステージ3(意図した通りに DOM 要素の構造を変更で
// 上の elementToAdd を、5 番の青色の要素の最初に追加するコードを
// ここに記述してください。
+ var element = document.querySelector('blockquote');
+ element.insertBefore(elementToAdd, element.firstChild);
var blockquote = document.querySelector('blockquote');
@@ -79,6 +93,7 @@ describe('ステージ3(意図した通りに DOM 要素の構造を変更で
// ここに以下のコードを記述してください。
//
// $('.brown-ghost').remove();
+ $('.brown-ghost').remove();
var $brown = $('#brown');
@@ -90,6 +105,7 @@ describe('ステージ3(意図した通りに DOM 要素の構造を変更で
it('7 番の要素からインベーダー要素を除去する', function() {
// ここにコードを記述してください。
+ $('.darkorange-space-invader').remove();
var $darkorange = $('#darkorange');
@@ -104,6 +120,7 @@ describe('ステージ3(意図した通りに DOM 要素の構造を変更で
it('8 番の要素の左右の幽霊要素をすべて除去する', function() {
// ここにコードを記述してください。
+ $('.limegreen-ghosts').remove();
var $limegreen = $('.limegreen');
@@ -115,6 +132,7 @@ describe('ステージ3(意図した通りに DOM 要素の構造を変更で
var $elementToAdd = $('\uD83D\uDC2C');
// 上の $elementToAdd を追加するコードをここに記述してください。
+ $('.mediumturquoise').append($elementToAdd);
var $mediumturquoise = $('.mediumturquoise');
@@ -127,6 +145,7 @@ describe('ステージ3(意図した通りに DOM 要素の構造を変更で
var $elementToAdd = $('\uD83D\uDC1F');
// 上の $elementToAdd を追加するコードをここに記述してください。
+ $('p').prepend($elementToAdd);
var $p = $('p');
diff --git a/public/stage4/tests.js b/public/stage4/tests.js
index 599536b6..0291be3a 100644
--- a/public/stage4/tests.js
+++ b/public/stage4/tests.js
@@ -23,6 +23,10 @@ describe('ステージ4(意図通りにイベントを利用できる)', fun
// });
//
// ここに上記のどちらかのコードを記述してください。
+ $('#firebrick').on('click', function(event) {
+ var $target = $(event.target);
+ $target.text(Number($target.text()) + 1);
+ });
var firebrick = document.getElementById('firebrick');
@@ -37,6 +41,10 @@ describe('ステージ4(意図通りにイベントを利用できる)', fun
it('2 番の要素の click イベントで要素内の数字を 1 ずつ小さくできる', function() {
// ここにコードを記述してください。
+ $('#chocolate').on('click', function(event) {
+ var $target = $(event.target);
+ $target.text(Number($target.text()) - 1);
+ });
var chocolate = document.getElementById('chocolate');
@@ -51,6 +59,19 @@ describe('ステージ4(意図通りにイベントを利用できる)', fun
it('3 番の要素の click イベントで要素を 10 度ずつ回転できる', function() {
// ここにコードを記述してください。
+ $('.mediumseagreen').on('click', function(event) {
+ var $target = $(event.target);
+ var deg = 0;
+
+ if (undefined === $target.attr('rotate-deg')) {
+ deg = 10;
+ } else {
+ deg = Number($target.attr('rotate-deg')) + 10;
+ }
+
+ $target.attr('rotate-deg', deg);
+ $target.css({transform: 'rotate(' + deg + 'deg)'});
+ });
var mediumseagreen = document.querySelector('.mediumseagreen');
@@ -67,6 +88,9 @@ describe('ステージ4(意図通りにイベントを利用できる)', fun
it('4 番の要素を入力された角度に回転できる', function() {
// ここにコードを記述してください。
+ $('.turquoise').on('change', function(event) {
+ $(this).css({transform: 'rotate(' + event.target.value + 'deg)'});
+ });
var turquoise = document.querySelector('.turquoise');
@@ -93,9 +117,11 @@ describe('ステージ4(意図通りにイベントを利用できる)', fun
// なお、expect(steelblue).to.be.null は上記のテストの要件を満たして
// いないので、正解ではありません。
- var steelblue = document.querySelector('.steelblue');
- expect(steelblue).to.have.property('textContent', '5 \uD83D\uDC33');
- done();
+ $(document).ready(function() {
+ var steelblue = document.querySelector('.steelblue');
+ expect(steelblue).to.have.property('textContent', '5 \uD83D\uDC33');
+ done();
+ });
});
});
});
diff --git a/public/stage5/tests.js b/public/stage5/tests.js
index 568548d3..5c5336a9 100644
--- a/public/stage5/tests.js
+++ b/public/stage5/tests.js
@@ -13,6 +13,11 @@ describe('ステージ5(意図通りに非同期処理を利用できる)',
// expect(msg).to.equal('resolved!');
// testDone();
// });
+
+ promise.then(function(msg) {
+ expect(msg).to.equal('resolved!');
+ testDone();
+ });
});
@@ -26,6 +31,12 @@ describe('ステージ5(意図通りに非同期処理を利用できる)',
// testDone();
// ここにコードを記述してください。
+ promise.then(function() {
+ // not colled
+ }, function(msg) {
+ expect(msg).to.equal('rejected!');
+ testDone();
+ });
});
@@ -38,7 +49,7 @@ describe('ステージ5(意図通りに非同期処理を利用できる)',
var promise3 = createWaitPromise(messageFragments[2], 30);
// 作成した promise を promise 変数に代入してください。
- var promise = 'change me!';
+ var promise = Promise.all([promise1, promise2, promise3]);
return expect(promise).to.eventually.deep.equal(messageFragments);
@@ -52,7 +63,7 @@ describe('ステージ5(意図通りに非同期処理を利用できる)',
var promise3 = createWaitPromise(messageFragments[2], 30);
// 作成した promise を promise 変数に代入してください。
- var promise = 'change me!';
+ var promise = Promise.race([promise1, promise2, promise3]);
return expect(promise).to.eventually.equal(messageFragments[1]);
@@ -73,6 +84,10 @@ describe('ステージ5(意図通りに非同期処理を利用できる)',
// return res.json();
// });
+ var promisedFriends = fetch(api + username).then(function(res) {
+ return res.json();
+ });
+
return expect(promisedFriends).to.eventually.have.length(1)
.and.have.members(['PYXC-PJ']);
@@ -84,7 +99,9 @@ describe('ステージ5(意図通りに非同期処理を利用できる)',
var username = 'Shen';
// 作成した promise を promisedFriends 変数に代入してください。
- var promisedFriends = 'change me!';
+ var promisedFriends = fetch(api + username).then(function(res) {
+ return res.json();
+ });
return expect(promisedFriends).to.eventually.have.length(2)
@@ -96,8 +113,24 @@ describe('ステージ5(意図通りに非同期処理を利用できる)',
var api = '/api/friends/';
var username = 'Shen';
+ var getResponseJSON = function(user) {
+ return fetch(api + user).then(function(response) {
+ return response.json();
+ });
+ };
+
+ var flatten = function(array) {
+ return Array.prototype.concat.apply([], array);
+ };
+
// 作成した promise を promisedFriends 変数に代入してください。
- var promisedFriends = 'change me!';
+ var promisedFriends = getResponseJSON(username)
+ .then(function(json) {
+ return Promise.all(json.map(getResponseJSON));
+ })
+ .then(function(arrayFriends) {
+ return flatten(arrayFriends);
+ });
return expect(promisedFriends).to.eventually.have.length(1)
@@ -127,7 +160,10 @@ describe('ステージ5(意図通りに非同期処理を利用できる)',
it('Github の mixi-inc の organization の情報を取得できる', function() {
// 作成した promise を mixiOrg 変数に代入してください。
- var mixiOrg = 'change me!';
+ var mixiOrg = fetch('http://api.github.com/orgs/mixi-inc')
+ .then(function(response) {
+ return response.json();
+ });
return expect(mixiOrg).to.eventually.have.property('id', 1089312);
@@ -140,7 +176,10 @@ describe('ステージ5(意図通りに非同期処理を利用できる)',
var repository = 'mixi-inc/JavaScriptTraining';
// 作成した promise を mixiRepo 変数に代入してください。
- var mixiRepo = 'change me!';
+ var mixiRepo = fetch('http://api.github.com/repos/' + repository)
+ .then(function(response) {
+ return response.json();
+ });
return expect(mixiRepo).to.eventually.have.property('full_name', repository);
@@ -153,9 +192,18 @@ describe('ステージ5(意図通りに非同期処理を利用できる)',
it('Github API を使って、VimL、Emacs Lisp でスターが最も多いプロダクト名を' +
'それぞれ 1 つずつ取得できる', function() {
var languages = [ 'VimL', '"Emacs Lisp"' ];
- var mostPopularRepos = 'change me!';
// 作成した promise を mostPopularRepos 変数に代入してください。
+ var mostPopularRepos = Promise.all(languages.map(function(language) {
+ var params = 'q=' + encodeURIComponent(language) + '&sort=stars';
+ return fetch('https://api.github.com/search/repositories?' + params)
+ .then(function(response){
+ return response.json();
+ })
+ .then(function(json) {
+ return json.items[0].name;
+ });
+ }));
return expect(mostPopularRepos).to.eventually.have.length(2)
diff --git a/public/stage7/tests.js b/public/stage7/tests.js
index 3a72ba58..b5167bad 100644
--- a/public/stage7/tests.js
+++ b/public/stage7/tests.js
@@ -14,39 +14,39 @@ describe('ステージ7(よくあるJSのイディオムを読める)', func
it('1回目の値がわかる', function() {
- expect(counter()).to.equal(/* ここに値を書き込んでください */);
+ expect(counter()).to.equal(0);
});
it('2回目の値がわかる', function() {
- expect(counter()).to.equal(/* ここに値を書き込んでください */);
+ expect(counter()).to.equal(1);
});
it('3回目の値がわかる', function() {
- expect(counter()).to.equal(/* ここに値を書き込んでください */);
+ expect(counter()).to.equal(2);
});
});
describe('ショートサーキット演算', function() {
it("true && 'default' の結果がわかる", function() {
- expect(true && 'default').to.equal(/* ここに値を書き込んでください */);
+ expect(true && 'default').to.equal('default');
});
it("false || 'default' の結果がわかる", function() {
- expect(false || 'default').to.equal(/* ここに値を書き込んでください */);
+ expect(false || 'default').to.equal('default');
});
it("0 || 'default' の結果がわかる", function() {
- expect(0 || 'default').to.equal(/* ここに値を書き込んでください */);
+ expect(0 || 'default').to.equal('default');
});
it("{} || 'default' の結果がわかる", function() {
- expect({} || 'default').to.deep.equal(/* ここに値を書き込んでください */);
+ expect({} || 'default').to.deep.equal({});
});
@@ -55,7 +55,7 @@ describe('ステージ7(よくあるJSのイディオムを読める)', func
return arg || { foo: 'foo' };
};
- expect(func({ foo: 'bar' })).to.deep.equal(/* ここに値を書き込んでください */);
+ expect(func({ foo: 'bar' })).to.deep.equal({ foo: 'bar' });
});
@@ -64,7 +64,7 @@ describe('ステージ7(よくあるJSのイディオムを読める)', func
return arg || { foo: 'foo' };
};
- expect(func()).to.deep.equal(/* ここに値を書き込んでください */);
+ expect(func()).to.deep.equal({ foo: 'foo' });
});
});
@@ -76,7 +76,7 @@ describe('ステージ7(よくあるJSのイディオムを読める)', func
num = 1;
})();
- expect(num).to.equal(/* ここに値を書き込んでください */);
+ expect(num).to.equal(1);
});
@@ -87,7 +87,7 @@ describe('ステージ7(よくあるJSのイディオムを読める)', func
num = 1;
}, 0);
- expect(num).to.equal(/* ここに値を書き込んでください */);
+ expect(num).to.equal(0);
});
@@ -97,22 +97,22 @@ describe('ステージ7(よくあるJSのイディオムを読める)', func
it('!!truthy の結果がわかる', function() {
- expect(!!truthy).to.equal(/* ここに値を書き込んでください */);
+ expect(!!truthy).to.equal(true);
});
it('!!falsey の結果がわかる', function() {
- expect(!!falsey).to.equal(/* ここに値を書き込んでください */);
+ expect(!!falsey).to.equal(false);
});
it('Boolean(truthy) の結果がわかる', function() {
- expect(Boolean(truthy)).to.equal(/* ここに値を書き込んでください */);
+ expect(Boolean(truthy)).to.equal(true);
});
it('Boolean(falsey) の結果がわかる', function() {
- expect(Boolean(falsey)).to.equal(/* ここに値を書き込んでください */);
+ expect(Boolean(falsey)).to.equal(false);
});
});
@@ -137,71 +137,71 @@ describe('ステージ7(よくあるJSのイディオムを読める)', func
it('parent.grandParent の値がわかる', function() {
- expect(parent.grandParent).to.equal(/* ここに値を書き込んでください */);
+ expect(parent.grandParent).to.equal(true);
});
it('parent.child の値がわかる', function() {
- expect(parent.child).to.equal(/* ここに値を書き込んでください */);
+ expect(parent.child).to.equal(undefined);
});
it('child.grandParent の値がわかる', function() {
- expect(child.grandParent).to.equal(/* ここに値を書き込んでください */);
+ expect(child.grandParent).to.equal(true);
});
it('child.parent の値がわかる', function() {
- expect(child.parent).to.equal(/* ここに値を書き込んでください */);
+ expect(child.parent).to.equal(true);
});
});
});
-describe.skip('あなたの闇のJS力', function() {
+describe('あなたの闇のJS力', function() {
// .skip を外せば始められます
describe('ゆるふわ == 演算子', function() {
it("'10' == 10 の振る舞いがわかる", function() {
expect('10' == 10)
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal(true);
});
it('null == undefined の振る舞いがわかる', function() {
expect(null == undefined)
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal(true);
});
it('null == false の振る舞いがわかる', function() {
expect(null == false)
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal(false);
});
it('true == 1 の振る舞いがわかる', function() {
expect(true == 1)
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal(true);
});
it('true == 10 の振る舞いがわかる', function() {
expect(true == 10)
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal(false);
});
it('[0, 1] == 0 の振る舞いがわかる', function() {
expect([0, 1] == 0)
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal(false);
});
it('[1] == 1 の振る舞いがわかる', function() {
expect([1] == 1)
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal(true);
});
});
@@ -209,72 +209,72 @@ describe.skip('あなたの闇のJS力', function() {
describe('意図しない truthy/falsey', function() {
it('Boolean(false) が truthy/falsey のどちらなのかわかる', function() {
expect(Boolean(false) ? true : false)
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal(false);
});
it('Boolean(0) が truthy/falsey のどちらなのかわかる', function() {
expect(Boolean(0) ? true : false)
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal(false);
});
it('new Boolean(0) が truthy/falsey のどちらなのかわかる', function() {
expect(new Boolean(0) ? true : false)
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal(true);
});
it("'abc' が truthy/falsey のどちらなのかわかる", function() {
expect('abc' ? true : false)
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal(true);
});
it("'' が truthy/falsey のどちらなのかわかる", function() {
expect('' ? true : false)
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal(false);
});
it('String(0) が truthy/falsey のどちらなのかわかる', function() {
expect(String(0) ? true : false)
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal(true);
});
it("String('') が truthy/falsey のどちらなのかわかる", function() {
expect(String('') ? true : false)
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal(false);
});
it('new String(0) が truthy/falsey のどちらなのかわかる', function() {
expect(new String(0) ? true : false)
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal(true);
});
it("new String('') が truthy/falsey のどちらなのかわかる", function() {
expect(new String('') ? true : false)
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal(true);
});
});
describe('読めないキャスト万歳!', function() {
it("10 + '' の値がわかる", function() {
- expect(10 + '').to.equal(/* ここに値を書き込んでください */);
+ expect(10 + '').to.equal('10');
});
it("+'10' の値がわかる", function() {
- expect(+'10').to.equal(/* ここに値を書き込んでください */);
+ expect(+'10').to.equal(10);
});
it("'10.1'|0 の値がわかる", function() {
- expect('10.1'|0).to.equal(/* ここに値を書き込んでください */);
+ expect('10.1'|0).to.equal(10);
});
@@ -282,51 +282,51 @@ describe.skip('あなたの闇のJS力', function() {
var obj = { length: 2, 0: 'foo', 1: 'bar' };
expect(Array.prototype.slice.call(obj))
- .to.deep.equal(/* ここに値を書き込んでください */);
+ .to.deep.equal(['foo', 'bar']);
});
it('+(new Date()) の型がわかる', function() {
expect(typeof +(new Date()))
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal('number');
});
it('(new Date()) + 0 の型がわかる', function() {
expect(typeof ((new Date()) + 0))
- .to.equal(/* ここに値を書き込んでください */);
+ .to.equal('string');
});
});
describe('ダブルスタンダード Array コンストラクタ', function() {
it('Array(3) が作成する配列の長さがわかる', function() {
- expect(Array(3)).to.have.length(/* ここに値を書き込んでください */);
+ expect(Array(3)).to.have.length(3);
});
it('Array(3) が作成する配列の0番目の要素がわかる', function() {
- expect(Array(3)[0]).to.equal(/* ここに値を書き込んでください */);
+ expect(Array(3)[0]).to.equal(undefined);
});
it('Array(3) が作成する配列がわかる', function() {
- expect(Array(3)).to.deep.equal(/* ここに値を書き込んでください */);
+ expect(Array(3)).to.deep.equal([]);
});
it('Array(1, 2, 3) が作成する配列の長さがわかる', function() {
- expect(Array(1, 2, 3)).to.have.length(/* ここに値を書き込んでください */);
+ expect(Array(1, 2, 3)).to.have.length(3);
});
it('Array(1, 2, 3) が作成する配列の0番目の要素がわかる', function() {
- expect(Array(1, 2, 3)[0]).to.equal(/* ここに値を書き込んでください */);
+ expect(Array(1, 2, 3)[0]).to.equal(1);
});
it('Array(1, 2, 3) が作成する配列がわかる', function() {
- expect(Array(1, 2, 3)).to.deep.equal(/* ここに値を書き込んでください */);
+ expect(Array(1, 2, 3)).to.deep.equal([1, 2, 3]);
});
});
@@ -336,7 +336,7 @@ describe.skip('あなたの闇のJS力', function() {
var obj = { foo: 'bar' };
with (obj) {
- expect(foo).to.equal(/* ここに値を書き込んでください */);
+ expect(foo).to.equal('bar');
}
});
@@ -345,7 +345,7 @@ describe.skip('あなたの闇のJS力', function() {
var obj = { 'foo': 'bar', 'undefined': 'bar' };
with (obj) {
- expect(foo === undefined).to.equal(/* ここに値を書き込んでください */);
+ expect(foo === undefined).to.equal(true);
}
});
@@ -354,7 +354,7 @@ describe.skip('あなたの闇のJS力', function() {
var obj = { 'foo': 'bar', 'null': 'bar' };
with (obj) {
- expect(foo === null).to.equal(/* ここに値を書き込んでください */);
+ expect(foo === null).to.equal(false);
}
});
});
@@ -362,35 +362,35 @@ describe.skip('あなたの闇のJS力', function() {
describe('JavaScript のゆるふわ型判定', function() {
it('typeof 0 の結果がわかる', function() {
- expect(typeof 0).to.equal(/* ここに値を書き込んでください */);
+ expect(typeof 0).to.equal('number');
});
it('typeof true の結果がわかる', function() {
- expect(typeof true).to.equal(/* ここに値を書き込んでください */);
+ expect(typeof true).to.equal('boolean');
});
it("typeof 'string' の結果がわかる", function() {
- expect(typeof 'string').to.equal(/* ここに値を書き込んでください */);
+ expect(typeof 'string').to.equal('string');
});
it('typeof function() {} の結果がわかる', function() {
- expect(typeof function() {}).to.equal(/* ここに値を書き込んでください */);
+ expect(typeof function() {}).to.equal('function');
});
it('typeof {} の結果がわかる', function() {
- expect(typeof {}).to.equal(/* ここに値を書き込んでください */);
+ expect(typeof {}).to.equal('object');
});
it('typeof [] の結果がわかる', function() {
- expect(typeof []).to.equal(/* ここに値を書き込んでください */);
+ expect(typeof []).to.equal('object');
});
it('typeof undefined の結果がわかる', function() {
- expect(typeof undefined).to.equal(/* ここに値を書き込んでください */);
+ expect(typeof undefined).to.equal('undefined');
});
it('typeof null の結果がわかる', function() {
- expect(typeof null).to.equal(/* ここに値を書き込んでください */);
+ expect(typeof null).to.equal('object');
});
});
});