GitHub - gaearon/react-proxy: Proxies React components without unmounting or losing their stateYou signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
Welcome to Future of Web Application Delivery
I’ve known for years I was delivering my web application the wrong way. Dropping 9 script tags at the top of a page and blocking UIDropping 132 script tags at the bottom of a page, screwing up the order of dependencies and flooding the networkUsing AMD without a build with waterfall dependency loading (oops)Using modules with a build, sending 650 kilobytes of gzipped code in a single file that the
Automated testing in Yahoo Mail
Background: We blogged about the evolution of Yahoo Mail to React + Flux and Node.js. It is important to focus on building a strong foundation when you are building a new platform and having a robust test infrastructure is a big part of the foundation. Yahoo Mail today relies on automated testing on our Continuous Integration pipeline before we deploy changes to production. We run Cucumber and Wai
React+Reduxのテスト方針をまとめた｜デロイト トーマツ ウェブサービス株式会社（DWS）公式ブログ
概要 React.js Advent Calendar21日目の記事です。 Reduxというフレームワークがじわじわ広まっている。Reduxは、Fluxの概念を拡張したもので、アプリケーションでひとつの状態をもつと、クライアントでの状態管理がいろいろ便利になるよ、というコンセプトを持つ。詳細は以下の記事が詳しい。 人気のFluxフレームワークReduxをさわってみた - マルシテイアは月の上 Motivation | Redux 筆者は現在React+Reduxでアプリケーションをつくっているが、今回は、そのテスト方針を書こうと思う。 テスト環境 karma+jasmine+sinonでつくる。E2Eはいろいろと・・・なので・・・メインはユニットテストで実装している。JavaScript DOMをつかってSimulationすれば、最低限は担保できるかなと考える。 テスト方針 大きな方針と
ES6 on React.js で徹底的にテストしてやる - Qiita
これは freee エンジニアによる、アドベントカレンダー 1日目の記事になります。言い出しっぺということで、初日を飾らせていただきました。 ビューのテストしてますか？ freee では、プロダクトによっていくつかの技術を組み合わせてフロントエンド開発を行っています。その中でES6 による React.js を使った実装が増えつつあります。特に、今の私の担当は、インタラクティブな挙動が求められ、DOMの状態が激しく変化する画面の開発となっております。そこで、React.js を使った開発が適していると判断し、かなり込み入ったReact.jsベースのビューコンポーネントを開発しています。 ところで、ビューのテストというと、下記のような様々な理由で相対的に優先度を低く扱われる場合が多いと思います。 ユーザの操作が起点となるためテスト実装がしづらい 細かな変更頻度が高くテスト実装によるオーバーヘ
テストがないJS環境にモダンなテスト環境を導入していく - Qiita
Qiita:Teamに投げた社内ドキュメントだったけど、特に問題ないのでQiitaにも投げる。 前提として browserify-rails とbabelify が導入されている状況を想定してる。 基本方針 新規コードはES2015で書く 本番はbrowserify(-rails)でコンパイルする。 単体テストは node 環境下で走らせる テスト環境下では jsdom で window, document をモックする 単体テストでは ブラウザ特有の挙動はテストしない 裏側の環境(browserifyやspec-helper)は難しくして良いが、利用者からみえる範囲は複雑にしない(npm install; npm testで走る) Universal JavaScript に寄せることでコードのポータビリティを上げる 事前準備 browserify-railsを導入する。 .babelr
Unit testing React components without a DOM
Update 12/04/17 Airbnb's Enzyme library offers the best solution for shallow rendering Update 04/01/16 Added better examples of skin-deep usage When unit testing React components the common approach has been to render them into a DOM (with something like jsdom) and run some assertions against them with the help of the React TestUtils. This has changed in 0.13 where an early implementation of shall
Straightforward React UI Testing | Toptal®
Editor’s note: This article was updated on 10/17/2022 by our editorial team. It has been modified to include recent sources and to align with our current editorial standards. Fully testing user interactions is notoriously difficult. Front-end views weren’t well-suited for traditional automated testing frameworks until React.js came along. With the advent of single page application (SPA) frameworks
Simple Routing with Redux and React
TL;DR? Clone the Starter Kit instead. Have you ever wished that libraries for React apps could be simpler? Sure, you know that there are cases when all the bells and whistles are an advantage — but for you, features aren’t as important as clarity. Instead of giving up control to fast-moving libraries written by big names, you want to understand what is going on under the hood. And instead of sifti
React.jsでPropやStateを使ってComponent間のやりとりをする - Qiita
今日はこれまでに紹介したPropやStateを使ったComponent間でやりとりについて書きたいと思います。 親のStateを子のPropとして渡す Componentを設計する時はまずPropとしてI/Fを考えて、そのComponentが管理すべき値で変更されるものをStateとして定義します。 つまりComponent間での親子の関係を意識して、親がStateを持っていて子にPropとして渡すというのが基本になります。（子は使うだけで管理しているのは親） var User = React.createClass({ propTypes: { name: React.PropTypes.string.isRequired, id: React.PropTypes.number.isRequired }, render() { return ( <div>{this.props.id}:
Dan Abramov - Live React: Hot Reloading with Time Travel at react-europe 2015
React’s unique strength is bringing to JavaScript development some of the benefits previously exclusive to more radically functional languages such as Elm and ClojureScript, without forcing you to completely eschew local state or rewrite code with exclusively immutable data structures. In this talk, Dan will demonstrate how React can be used together with Webpack Hot Module Replacement to create a
React TutorialをES6で書きなおしてみた - console.blog(self);
できあがったのはこちら。 sadah/react-tutorial-es6 Reactを触ってみたいと思って、チュートリアルをやってみた。翻訳してくださっているかたがいて、訳もわかりやすくてとても助かった。 Tutorial | React React.jsチュートリアル【日本語翻訳】 | mae's blog チュートリアルでは JSXTransformer.js を使っているので、JSXの変換などを考える必要はない。手軽なんだけど、Reactを使おうとしたらけっきょくコンパイルしなきゃいけない。 コンパイルにはBabelが必要になる。Babel使うならES6も使いたい。ES6の変換は自動的にやりたいし、ファイルはminifyしたいし、minifyしたらsource mapが欲しいし、変更したら自動的にブラウザを更新したい。って感じであれこれやってみた。 Environment ディレク
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - enzymejs/enzyme: JavaScript Testing utilities for React
GitHub - jquense/teaspoon: A jQuery like API for testing React elements and rendered components.
GitHub - algolia/expect-jsx: ✅ toEqualJSX for expect assertion library
GitHub - pzavolinsky/react-unit: Lightweight unit test library for ReactJS
GitHub - Swizec/react-testing-example: A sample project to investigate testing options with ReactJS
GitHub - jonathanglasmeyer/react-0-13-testing-mocha-jsdom-babel: Testing React components with Mocha, Chai, JSDom, React 0.13 and Babel
GitHub - jmrog/react-essentials-es6-version: A refactoring of the project described in "React.js Essentials" using ES6 rather than just ES5.
baobab-react/docs/mixins.md at master · Yomguithereal/baobab-react
