自己紹介 @kyo_ago ChatWorkの中の人です 普段はLT中心 ApplicationCacheとかSSEとかCSSを何とかしたい人 (自覚は無いです)
実務でよく使うhtml,css,jsの小技をつらつらと紹介します。 ※2/11のスクーの授業中で使った資料です。 https://schoo.jp/class/1776 【オシャレCSS編】 1. transformを使って要素を変形させるワザ 2. transitionを使い、CSSだけで簡単なアニメーションを行うワザ 3. keyframesを使ってCSSだけで複雑なアニメーションを行うワザ 4. 矢印アイコンをcssだけで表現するワザ 5. アイコンをアニメーションさせるワザ 6. CSSプロパティ”filter”で画像を加工するワザ 【地味だけど使えるワザ編】 7. 今どきの、要素を上下中央寄せにするワザ 8.「flexbox」で要素を自由自在に整列させるワザ 9. Windowsでwebfontをちょっとマシに見せるワザ 10. ア
先日書いた自分用アプリケーションのひな形 http://d.hatena.ne.jp/naoya/20130503/1367581629 http://d.hatena.ne.jp/naoya/20130504/1367640512 これに、JavaScript のテスト環境も追加したい。 結論からいくと、フレームワークには mocha + expect、ランナーは testem を使うことにした。ついでにテストダブルライブラリとして Sinon.js も有効にした。 ちなみに今回の文脈は End to End のテストではなくてユニットテスト周りのおはなしです。 mocha + expect JavaScript のこの辺のテスト周りは今もいろいろなツールの整備が進んでいて、今回採用した以外にも Jasmin や QUnit そのほか色んな物がある。昨今の状況に関しては 先日の HTML
jQuery#triggerのテスト describe('jQuery#trigger', function() { it('イベントハンドラに値を渡せること', function(done) { var $el = $('<div>'); $el.bind('foo', function(event, val) { expect(val).to.be('bar'); done(); }); $el.trigger('foo', 'bar'); }); }); コールバックが2回呼ばれるかをテスト describe('jQuery#trigger', function() { it('イベントハンドラに値を渡せること', function(done) { var $el = $('<div>'); var count = 0; $el.bind('foo', function(event,
I have some unit tests for a function that makes use of the window.location.href -- not ideal I would far rather have passed this in but its not possible in the implementation. I'm just wondering if its possible to mock this value without actually causing my test runner page to actually go to the URL. window.location.href = "http://www.website.com?varName=foo"; expect(actions.paramToVar(test_Data)
The document discusses the structure and functionality of a todo application built with Ruby on Rails, covering model validations, controller actions, and JSON responses for creating, updating, and deleting todos. It includes testing strategies using RSpec and Mocha, as well as JavaScript with libraries like Chai and Sinon for assertions and mocking. Additionally, it emphasizes using AJAX for dyna
mochaとは mocha(モカ)は、javascriptの単体テストでよく使用されているテストフレームワークです。 node.jsやブラウザから実行ですることもできます。また、非同期のテストも可能になってます。 なお、mocha自体はアサーション機能は持っていません。なので、値の検証は標準のassertとかchaiとかshouldを使用します。 TDDやBDDスタイルでテストを記述でき、テスト結果もいろいろな形式で出力できます。 今回はmochaの基本的な使用方法について紹介します。 環境構築方法 今回使用した動作環境は以下のとおりです。 OS : MacOS X 10.7.4 Node.js : v0.8.15 npm : 1.1.66 適当なディレクトリを作成し、そこでnpmを使用してmochaをインストールします。 mochaコマンドを使用するので、gオプションつきでインストールし
表題のとおり. Test-Driven JavaScript Development 最終的なコード test.html テストのエントリポイントとなる html test.js テストコード本体 ajax.js 今回の開発対象の ajax リクエストを抽象化するライブラリ integration.html 結合テスト用の html. 実際に get リクエストを飛ばす successful_get_test.js 結合テスト用の js. fragment.html 結合テスト用. この html を xhr で取得する. 準備 xhr のテストなのでクライアントサイドで動かさないといけない. html を準備. 公式にサンプルがある. <html> <head> <meta charset="utf-8"> <title>Mocha Tests</title> <link rel="st
A Test-Driven JS Assessment というテストを通るようなコードを書いて、JavaScriptを学ぶものが公開されていたので、それの紹介です。 JS Assessmentは最初に失敗するテストが用意されていて、そのテストコードを通るような関数などを書いていってJavaScriptの力試し、学習をするものです。 簡単にやり方を書くと、Node環境を用意した状態で git clone https://github.com/rmurphey/js-assessment.gitなどで、リポジトリをダウンロードして、 ダウンロードしたディレクトリ内で、 nodeを使って以下のようコマンドを実行してテストが実行できるローカルサーバを立ち上げます。 実行した状態で http://localhost:4444 というURLに行けば、Mochaで書かれたテストが走った結果が表示されます
Did you write your source code as JavaScript AMD modules in RequireJs? Do you want to test them in real browsers? Do you want the flexibility of using Mocha or Jasmine? This is the moment you've been waiting for. Testacular is a "spetacular test runner for JavaScript" that was written to support the AngularJs project. It is valuable because it will run your tests in real browsers. This is importan
JavaScript Advent Calendar 2011 (Node.js/WebSocketsコース)3日目のhokacchaです。Node.jsのテストフレームワーク、mochaについて書きます。 mochaはTJが新しく作り始めているテストフレームワークです。ドキュメントを見ればできることは大体書いてありますので、ドキュメントを元にどういうことができるのかを解説していきます。現時点でのバージョンは0.2.0です。 http://visionmedia.github.com/mocha/ shouldについて まずmochaでどういうことができるかの前にshouldについて解説しておきます。mochaのドキュメントには特に説明もなくshouldが使われていて、shouldでどういうことができるかわかってないと、ドキュメントを読んだときにmochaの機能なのかshouldの機能なの
2011年12月21日 Node.jsのテスティングフレームワーク「Mocha」(後編) 前回に引き続き、Mochaのチュートリアルに沿ってMocha(バージョン0.3.6)を使ってみます。 なお、このエントリーはJavaScript Advent Calendar 2011(Node.js/WebSocketsコース)の参加エントリーです。 前回のあらすじアサーションは好きなライブラリを組み込んで使えるよ!同期・非同期どちらのコードでもテストできるよ!テスト実行の前後に呼ばれるコードを書いて、前準備や後始末ができるよ!「あとで書く」用途のテストを書けるよ!便利なオプションがたくさんあるよ!テスト結果の表示形式がすごく見やすいよ!テストの書き方を色々選べるよ!ざっとこんな感じの内容を書きました。 では、前回からの続きです。 Reportersテスト結果の出力形式は以下のとおりです(スクリー
2011年12月19日 Node.jsのテスティングフレームワーク「Mocha」(前編) Mochaのチュートリアルに沿ってMocha(読み:もか)を使ってみました。 長いので前編・後編の二部構成にします。 使用するMochaのバージョンは0.3.6です。 はじめにこのエントリーのために書いたサンプルコードは以下に置いておきます。 https://github.com/ryu22e/mocha-example FeaturesGoogle翻訳と辞書を頼りに翻訳しました。もっと適切な訳があればご指摘お願いします。 browser support(ブラウザサポート) simple async support(シンプルな非同期サポート) proper exit status for CI support etc(CIサポート等のための適切な終了ステータス) auto-detects and di
Testing Backbone applications with Jasmine and Sinon Part 1: Introduction 3 March 2011 Overview This is the first in a series of articles demonstrating how to test a Backbone.js application, employing the Jasmine BDD test framework and the Sinon.JS spying, stubbing and mocking library. In this part, we’ll take a brief look at Backbone, and then move on to an introduction to some of the features of
mocha-phantomjs PhantomJS Runners for Mocha Download ZIP Download TAR View On GitHub This project is maintained by metaskills PhantomJS Runners for Mocha Mocha is a feature-rich JavaScript test framework running on node and the browser. Along with the Chai assertion library they make an impressive combo. PhantomJS is a headless WebKit with a JavaScript/CoffeeScript API. It has fast and native supp
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く