browserify-adventure-jp/problems/build_a_widget/problem.txt

learn browserify with this educational adventure

今回は検証プログラムがあなたのコードを実行します。以下のような具合です:

  var Widget = require('widget');
  var w = Widget();
  w.setName('beep boop');
  w.appendTo(document.body);

この `require('widget')` によって呼び出されるwidgetモジュールを実装してください。
widgetモジュールはhtmlのエレメントを次のようなHTMLの文字列から生成します。

  <div>Hello <span class="name"></span>!</div>

この文字列をDOMの要素にするにはnpmのdomfyパッケージを利用します。

  npm install domify

`require('domify')` してHTML要素を返す `domify(html)` 関数を呼び出します。
もしくはDOM要素を `document.createElement('div')` で生成し、innerHTMLに
直接割り当てることもできます。

widgetモジュールは `w.setName(str)` と `w.appendTo(target)` を実装している必要があります。
`w.setName(str)` は "name" spanタグの内部コンテキストを `str` で更新します。
`elem.querySelector('cssセレクタ')` によって得られたspan要素の
 ハンドルに対し `.textContent` を設定できます。

`w.appendTo(target)` は widget の内部HTML要素に `target` を追加します。
`target.appendChild(elem)` を利用してwidgetの要素に `target` を追加できます。

プログラムを `browserify -r ./widget.js:widget` としてコンパイルして `require('widget')`
をエクスポーズし、それを `$ADVENTURE_COMMAND verify` にパイプしてください:

  browserify -d -r ./widget.js:widget | $ADVENTURE_COMMAND verify

`-d` によってデバッグモードがオンになり、エラーが発生した場合にはスタックトレースが
出力されます。