From d36750e52f88135461347225be67b5d82a7517a4 Mon Sep 17 00:00:00 2001 From: Kevin Brown Date: Wed, 1 Mar 2017 11:02:35 +1100 Subject: [PATCH] Added snapshot testing. --- .babelrc | 3 + .editorconfig | 21 + .eslintignore | 1 - __mocks__/.eslintrc.js | 6 + __mocks__/react-native-maps.js | 15 + __tests__/.eslintrc.js | 6 + __tests__/index.android.js | 12 - __tests__/index.ios.js | 12 - .../Info/__snapshots__/index.test.js.snap | 505 ++ .../Info/components/CodeOfConduct.test.js | 15 + .../scenes/Info/components/Organiser.test.js | 20 + .../__snapshots__/CodeOfConduct.test.js.snap | 345 + .../__snapshots__/Organiser.test.js.snap | 101 + __tests__/scenes/Info/index.test.js | 15 + .../Schedule/__snapshots__/index.test.js.snap | 5641 +++++++++++++++++ .../scenes/Schedule/components/Break.test.js | 15 + .../Schedule/components/NowButton.test.js | 15 + .../Schedule/components/SplashScreen.test.js | 23 + .../scenes/Schedule/components/Talk.test.js | 15 + .../__snapshots__/Break.test.js.snap | 184 + .../__snapshots__/NowButton.test.js.snap | 80 + .../__snapshots__/SplashScreen.test.js.snap | 113 + .../__snapshots__/Talk.test.js.snap | 160 + __tests__/scenes/Schedule/index.test.js | 15 + .../Talk/__snapshots__/index.test.js.snap | 268 + __tests__/scenes/Talk/components/Hint.test.js | 15 + __tests__/scenes/Talk/components/Pane.test.js | 24 + .../scenes/Talk/components/Preview.test.js | 33 + .../scenes/Talk/components/Speaker.test.js | 34 + .../__snapshots__/Hint.test.js.snap | 65 + .../__snapshots__/Pane.test.js.snap | 275 + .../__snapshots__/Preview.test.js.snap | 133 + .../__snapshots__/Speaker.test.js.snap | 591 ++ __tests__/scenes/Talk/index.test.js | 15 + __tests__/setup.js | 17 + android/app/build.gradle | 19 +- app/scenes/Schedule/index.js | 4 +- app/scenes/Talk/components/Preview/index.js | 4 +- index.android.js | 4 - index.ios.js => index.js | 2 +- ios/ReactConf2017/AppDelegate.m | 2 +- jsconfig.json | 9 + package.json | 71 +- yarn.lock | 65 +- 44 files changed, 8911 insertions(+), 77 deletions(-) create mode 100644 .babelrc create mode 100644 .editorconfig delete mode 100644 .eslintignore create mode 100644 __mocks__/.eslintrc.js create mode 100644 __mocks__/react-native-maps.js create mode 100644 __tests__/.eslintrc.js delete mode 100644 __tests__/index.android.js delete mode 100644 __tests__/index.ios.js create mode 100644 __tests__/scenes/Info/__snapshots__/index.test.js.snap create mode 100644 __tests__/scenes/Info/components/CodeOfConduct.test.js create mode 100644 __tests__/scenes/Info/components/Organiser.test.js create mode 100644 __tests__/scenes/Info/components/__snapshots__/CodeOfConduct.test.js.snap create mode 100644 __tests__/scenes/Info/components/__snapshots__/Organiser.test.js.snap create mode 100644 __tests__/scenes/Info/index.test.js create mode 100644 __tests__/scenes/Schedule/__snapshots__/index.test.js.snap create mode 100644 __tests__/scenes/Schedule/components/Break.test.js create mode 100644 __tests__/scenes/Schedule/components/NowButton.test.js create mode 100644 __tests__/scenes/Schedule/components/SplashScreen.test.js create mode 100644 __tests__/scenes/Schedule/components/Talk.test.js create mode 100644 __tests__/scenes/Schedule/components/__snapshots__/Break.test.js.snap create mode 100644 __tests__/scenes/Schedule/components/__snapshots__/NowButton.test.js.snap create mode 100644 __tests__/scenes/Schedule/components/__snapshots__/SplashScreen.test.js.snap create mode 100644 __tests__/scenes/Schedule/components/__snapshots__/Talk.test.js.snap create mode 100644 __tests__/scenes/Schedule/index.test.js create mode 100644 __tests__/scenes/Talk/__snapshots__/index.test.js.snap create mode 100644 __tests__/scenes/Talk/components/Hint.test.js create mode 100644 __tests__/scenes/Talk/components/Pane.test.js create mode 100644 __tests__/scenes/Talk/components/Preview.test.js create mode 100644 __tests__/scenes/Talk/components/Speaker.test.js create mode 100644 __tests__/scenes/Talk/components/__snapshots__/Hint.test.js.snap create mode 100644 __tests__/scenes/Talk/components/__snapshots__/Pane.test.js.snap create mode 100644 __tests__/scenes/Talk/components/__snapshots__/Preview.test.js.snap create mode 100644 __tests__/scenes/Talk/components/__snapshots__/Speaker.test.js.snap create mode 100644 __tests__/scenes/Talk/index.test.js create mode 100644 __tests__/setup.js delete mode 100644 index.android.js rename index.ios.js => index.js (96%) create mode 100644 jsconfig.json diff --git a/.babelrc b/.babelrc new file mode 100644 index 0000000..6bcc105 --- /dev/null +++ b/.babelrc @@ -0,0 +1,3 @@ +{ + "presets": ["react-native"] +} diff --git a/.editorconfig b/.editorconfig new file mode 100644 index 0000000..945086b --- /dev/null +++ b/.editorconfig @@ -0,0 +1,21 @@ +# This file is for unifying the coding style for different editors and IDEs +# editorconfig.org +root = true + +[*] +end_of_line = lf +charset = utf-8 +trim_trailing_whitespace = true +insert_final_newline = true +indent_style = tab + +[*.js] +indent_size = 4 + +[*.json] +indent_style = space +indent_size = 2 + +[*.yml] +indent_style = space +indent_size = 2 \ No newline at end of file diff --git a/.eslintignore b/.eslintignore deleted file mode 100644 index a6c57f5..0000000 --- a/.eslintignore +++ /dev/null @@ -1 +0,0 @@ -*.json diff --git a/__mocks__/.eslintrc.js b/__mocks__/.eslintrc.js new file mode 100644 index 0000000..7da928b --- /dev/null +++ b/__mocks__/.eslintrc.js @@ -0,0 +1,6 @@ +module.exports = { + 'env': { + 'es6': true, + 'jest': true, + }, +}; diff --git a/__mocks__/react-native-maps.js b/__mocks__/react-native-maps.js new file mode 100644 index 0000000..dc7ebcd --- /dev/null +++ b/__mocks__/react-native-maps.js @@ -0,0 +1,15 @@ +import React from 'react'; + +export default class MapView extends React.Component { + render () { + return React.createElement('MapView', this.props, this.props.children); + } +} + +class Marker extends React.Component { + render () { + return React.createElement('Marker', this.props, this.props.children); + } +} + +MapView.Marker = Marker; diff --git a/__tests__/.eslintrc.js b/__tests__/.eslintrc.js new file mode 100644 index 0000000..a65a3dc --- /dev/null +++ b/__tests__/.eslintrc.js @@ -0,0 +1,6 @@ +module.exports = { + 'env': { + 'es6': true, + 'jest': true, + }, +}; \ No newline at end of file diff --git a/__tests__/index.android.js b/__tests__/index.android.js deleted file mode 100644 index b49b908..0000000 --- a/__tests__/index.android.js +++ /dev/null @@ -1,12 +0,0 @@ -import 'react-native'; -import React from 'react'; -import Index from '../index.android.js'; - -// Note: test renderer must be required after react-native. -import renderer from 'react-test-renderer'; - -it('renders correctly', () => { - const tree = renderer.create( - - ); -}); diff --git a/__tests__/index.ios.js b/__tests__/index.ios.js deleted file mode 100644 index ba7c5b5..0000000 --- a/__tests__/index.ios.js +++ /dev/null @@ -1,12 +0,0 @@ -import 'react-native'; -import React from 'react'; -import Index from '../index.ios.js'; - -// Note: test renderer must be required after react-native. -import renderer from 'react-test-renderer'; - -it('renders correctly', () => { - const tree = renderer.create( - - ); -}); diff --git a/__tests__/scenes/Info/__snapshots__/index.test.js.snap b/__tests__/scenes/Info/__snapshots__/index.test.js.snap new file mode 100644 index 0000000..104802c --- /dev/null +++ b/__tests__/scenes/Info/__snapshots__/index.test.js.snap @@ -0,0 +1,505 @@ +exports[`Info renders correctly 1`] = ` + + + + + + + + + The conference will be taking place on February 22nd and 23rd, with talks from 10am to 6pm each day. Plan to hang out with us each evening for plenty of socializing over food and drink + + + + Code of Conduct + + + + + + ORGANISERS + + + + + + + + + + Cheng Lou + + + What is a piece of code? What is a library, a tool, a platform and a language? + + + + + + + + + + + + Max Stoiber + + + What if we took the best of JavaScript and the best of CSS, and combined them together to create the ultimate styling solution for React? + + + + + + + + + + + + Michael Jackson + + + React Router is a full-featured routing layer for React applications that run in the browser, on the server, on React Native, and anywhere else React runs. + + + + + + + + + Made by Thinkmill + + + + We provide design & development expertise on-tap to help you build and ship your next digital product, platform, or app. + + + + + +`; diff --git a/__tests__/scenes/Info/components/CodeOfConduct.test.js b/__tests__/scenes/Info/components/CodeOfConduct.test.js new file mode 100644 index 0000000..debee1f --- /dev/null +++ b/__tests__/scenes/Info/components/CodeOfConduct.test.js @@ -0,0 +1,15 @@ +import 'react-native'; +import React from 'react'; +import renderer from 'react-test-renderer'; + +import CodeOfConduct from '../../../../app/scenes/Info/components/CodeOfConduct'; + +describe('Info - Code of Conduct', () => { + it('renders correctly', () => { + const tree = renderer.create( + {}} /> + ).toJSON(); + + expect(tree).toMatchSnapshot(); + }); +}); diff --git a/__tests__/scenes/Info/components/Organiser.test.js b/__tests__/scenes/Info/components/Organiser.test.js new file mode 100644 index 0000000..fe8859d --- /dev/null +++ b/__tests__/scenes/Info/components/Organiser.test.js @@ -0,0 +1,20 @@ +import 'react-native'; +import React from 'react'; +import renderer from 'react-test-renderer'; + +import Organiser from '../../../../app/scenes/Info/components/Organiser'; + +describe('Info - Organiser', () => { + it('renders correctly', () => { + const tree = renderer.create( + {}} + summary="We are testing." + /> + ).toJSON(); + + expect(tree).toMatchSnapshot(); + }); +}); diff --git a/__tests__/scenes/Info/components/__snapshots__/CodeOfConduct.test.js.snap b/__tests__/scenes/Info/components/__snapshots__/CodeOfConduct.test.js.snap new file mode 100644 index 0000000..cc86061 --- /dev/null +++ b/__tests__/scenes/Info/components/__snapshots__/CodeOfConduct.test.js.snap @@ -0,0 +1,345 @@ +exports[`Info - Code of Conduct renders correctly 1`] = ` + + + + + + + + + + + + Code of Conduct + + + + + All delegates, speakers and volunteers at React Conf are required to agree with the following code of conduct. Organizers will enforce this code throughout the event. + + + + + The Quick Version + + + Facebook is dedicated to providing a harassment-free conference experience for everyone, regardless of gender, sexual orientation, disability, physical appearance, body size, race, or religion. We do not tolerate harassment of conference participants in any form. Sexual language and imagery is not appropriate for any conference venue, including talks. + + + Conference participants violating these rules may be sanctioned or expelled from the conference without a refund at the discretion of the conference organizers. + + + + + The Less Quick Version + + + Harassment includes offensive verbal comments related to gender, sexual orientation, disability, physical appearance, body size, race, religion, sexual images in public spaces, deliberate intimidation, stalking, following, harassing photography or recording, sustained disruption of talks or other events, inappropriate physical contact, and unwelcome sexual attention. + + + Participants asked to stop any harassing behavior are expected to comply immediately. + + + If a participant engages in harassing behavior, the conference organizers may take any action they deem appropriate, including warning the offender or expulsion from the conference with no refund. + + + If you are being harassed, notice that someone else is being harassed, or have any other concerns, please contact a member of conference staff immediately. + + + Conference staff will be happy to help participants contact venue security or local law enforcement, provide escorts, or otherwise assist those experiencing harassment to feel safe for the duration of the conference. We value your attendance. + + + We expect participants to follow these rules at all conference venues and conference-related social events. + + + + + + +  + + + + + + +`; diff --git a/__tests__/scenes/Info/components/__snapshots__/Organiser.test.js.snap b/__tests__/scenes/Info/components/__snapshots__/Organiser.test.js.snap new file mode 100644 index 0000000..e29f23e --- /dev/null +++ b/__tests__/scenes/Info/components/__snapshots__/Organiser.test.js.snap @@ -0,0 +1,101 @@ +exports[`Info - Organiser renders correctly 1`] = ` + + + + + + + + Tes Ting + + + We are testing. + + + + +`; diff --git a/__tests__/scenes/Info/index.test.js b/__tests__/scenes/Info/index.test.js new file mode 100644 index 0000000..bbf2cad --- /dev/null +++ b/__tests__/scenes/Info/index.test.js @@ -0,0 +1,15 @@ +import 'react-native'; +import React from 'react'; +import renderer from 'react-test-renderer'; + +import Info from '../../../app/scenes/Info'; + +describe('Info', () => { + it('renders correctly', () => { + const tree = renderer.create( + + ).toJSON(); + + expect(tree).toMatchSnapshot(); + }); +}); diff --git a/__tests__/scenes/Schedule/__snapshots__/index.test.js.snap b/__tests__/scenes/Schedule/__snapshots__/index.test.js.snap new file mode 100644 index 0000000..4a7ac1f --- /dev/null +++ b/__tests__/scenes/Schedule/__snapshots__/index.test.js.snap @@ -0,0 +1,5641 @@ +exports[`Schedule renders correctly 1`] = ` + + + + + + + + + + + + + + + Schedule + + + + + Event Info + + + + + + + + + + + + + + 9:30am + — + Max Stoiber + + + The Road to Styled Components + + + + + + + +  + + + + + + + + + + +  + + + + + + + 10:30am + — + Cameron Westland + + + Design Specific Language + + + + + + + +  + + + + + + + + + + 11:30am + — + 12:30pm + Break + + + + + + + + + + 12:30pm + — + Michaela Lehr + + + Goodbye Flatland! An introduction to ReactVR and what it means for web developers + + + + + + + +  + + + + + + + + + + + + 1:30pm + — + Michael Jackson + + + Learn Once, Route Anywhere + + + + + + + +  + + + + + + + + + + + + 2:30pm + — + Parashuram N + + + Web-Like Development and Release Agility for React Native + + + + + + + +  + + + + + + + + + + + + 3:30pm + — + Leland Richardson + + + React Native in the \"Brown Field\" + + + + + + + +  + + + + + + + + + + + + 4:30pm + — + Robert Zhu + + + Realtime React Apps with GraphQL + + + + + + + +  + + + + + + + + + + + + 5:30pm + — + Rogelio Guzman + + + Jest Snapshots and Beyond + + + + + + + +  + + + + + + + + + + + + 6:30pm + — + Nicole Chung + + + How to React in the Slow Lane + + + + + + + +  + + + + + + + + + + + + 7:30pm + — + Jared Forsyth + + + Type Systems Will Make You a Better JavaScript Developer + + + + + + + +  + + + + + + + + + + + + 8:30pm + — + Ben Ilegbodu + + + React + ES.next = ♥ + + + + + + + +  + + + + + + + + + + + + 9:30pm + — + Preethi Kasireddy + + + MobX vs Redux: Comparing the Opposing Paradigms + + + + + + + +  + + + + + + + + + + + + 10:30pm + — + Lin Clark + + + A Cartoon Intro to Fiber + + + + + + + +  + + + + + + + + + + + + 11:30pm + — + Andres Suarez + + + Moving Fast with Nuclide and Flow + + + + + + + +  + + + + + + + + + + + + 12:30am + — + Dustan Kasten + + + React Everything, Render Everywhere + + + + + + + +  + + + + + + + + + + + + 1:30am + — + Guillermo Rauch + + + Next.js: Universal React Made Easy and Simple + + + + + + + +  + + + + + + + + + + + + 2:30am + — + Tal Kol + + + Moving Beyond Animations to User Interactions at 60 FPS in React Native + + + + + + + +  + + + + + + + + + + + + 3:30am + — + Jing Chen + + + Keynote + + + + + + + +  + + + + + + + + + + + + 4:30am + — + Marie-Laure Thuret + + + React-Storybook: Design, Develop, Document and Debug your React UI components + + + + + + + +  + + + + + + + + + + + + 5:30am + — + Ken Wheeler + + + Using React for Anything but Websites + + + + + + + +  + + + + + + + + + + + + 6:30am + — + Cheng Lou + + + Building React Components with Reason + + + + + + + +  + + + + + + + + + + + + 7:30am + — + Sebastian Markbage + + + Keynote + + + + + + + +  + + + + + + + + + + + + 8:30am + — + Troy Connor + + + Building React Communities Outside of Your Circle + + + + + + + +  + + + + + + + + + + + + 9:30am + — + Merrick Christensen + + + React to Code + + + + + + + +  + + + + + + + + + + + + 10:30am + — + Feather Knee + + + Building Applications for a Studio in the Cloud at Netflix + + + + + + + +  + + + + + + + + + + + + 11:30am + — + Adam Perry + + + Create React Native App: 5 Minutes to \"Hello, World!\" + + + + + + + +  + + + + + + + + + + + + 12:30pm + — + Aditya Punjani + + + The Great Convergence with React + + + + + + + +  + + + + + + + + + + + + 1:30pm + — + Samer Buna + + + You Don\'t Need a Fancy Framework to Use GraphQL with React + + + + + + + +  + + + + + + + + + + + + 2:30pm + — + Sophia Shoemaker + + + AWS Lambda + AWS Gateway + React = AWEsome + + + + + + + +  + + + + + + + + + + + + 3:30pm + — + Peggy Rayzis + + + Cross-Platform Data Visualization with React and React Native + + + + + + + +  + + + + + + + + + + + + 4:30pm + — + James Long + + + A Prettier Printer + + + + + + + +  + + + + + + + + + + + + 5:30pm + — + Neehar Venugopal + + + A Beginner\'s Guide to Code Splitting Your React App + + + + + + + +  + + + + + + + + Event Info + + + + + + +`; diff --git a/__tests__/scenes/Schedule/components/Break.test.js b/__tests__/scenes/Schedule/components/Break.test.js new file mode 100644 index 0000000..a3cf9ef --- /dev/null +++ b/__tests__/scenes/Schedule/components/Break.test.js @@ -0,0 +1,15 @@ +import 'react-native'; +import React from 'react'; +import renderer from 'react-test-renderer'; + +import Break from '../../../../app/scenes/Schedule/components/Break'; + +describe('Schedule - Break', () => { + it('renders correctly', () => { + const tree = renderer.create( + + ).toJSON(); + + expect(tree).toMatchSnapshot(); + }); +}); diff --git a/__tests__/scenes/Schedule/components/NowButton.test.js b/__tests__/scenes/Schedule/components/NowButton.test.js new file mode 100644 index 0000000..5944d56 --- /dev/null +++ b/__tests__/scenes/Schedule/components/NowButton.test.js @@ -0,0 +1,15 @@ +import 'react-native'; +import React from 'react'; +import renderer from 'react-test-renderer'; + +import NowButton from '../../../../app/scenes/Schedule/components/NowButton'; + +describe('Schedule - Now Button', () => { + it('renders correctly', () => { + const tree = renderer.create( + {}} /> + ).toJSON(); + + expect(tree).toMatchSnapshot(); + }); +}); diff --git a/__tests__/scenes/Schedule/components/SplashScreen.test.js b/__tests__/scenes/Schedule/components/SplashScreen.test.js new file mode 100644 index 0000000..7a1c31e --- /dev/null +++ b/__tests__/scenes/Schedule/components/SplashScreen.test.js @@ -0,0 +1,23 @@ +import 'react-native'; +import React from 'react'; +import renderer from 'react-test-renderer'; + +import SplashScreen from '../../../../app/scenes/Schedule/components/SplashScreen'; + +describe('Schedule - Splash Screen', () => { + it('renders correctly', () => { + const tree = renderer.create( + + ).toJSON(); + + expect(tree).toMatchSnapshot(); + }); + + it('renders correctly in animated state', () => { + const tree = renderer.create( + + ).toJSON(); + + expect(tree).toMatchSnapshot(); + }); +}); diff --git a/__tests__/scenes/Schedule/components/Talk.test.js b/__tests__/scenes/Schedule/components/Talk.test.js new file mode 100644 index 0000000..99f69f1 --- /dev/null +++ b/__tests__/scenes/Schedule/components/Talk.test.js @@ -0,0 +1,15 @@ +import 'react-native'; +import React from 'react'; +import renderer from 'react-test-renderer'; + +import Talk from '../../../../app/scenes/Schedule/components/Talk'; + +describe('Schedule - Talk', () => { + it('renders correctly', () => { + const tree = renderer.create( + {}} /> + ).toJSON(); + + expect(tree).toMatchSnapshot(); + }); +}); diff --git a/__tests__/scenes/Schedule/components/__snapshots__/Break.test.js.snap b/__tests__/scenes/Schedule/components/__snapshots__/Break.test.js.snap new file mode 100644 index 0000000..2cb5153 --- /dev/null +++ b/__tests__/scenes/Schedule/components/__snapshots__/Break.test.js.snap @@ -0,0 +1,184 @@ +exports[`Schedule - Break renders correctly 1`] = ` + + + + + — + Break + + + +`; diff --git a/__tests__/scenes/Schedule/components/__snapshots__/NowButton.test.js.snap b/__tests__/scenes/Schedule/components/__snapshots__/NowButton.test.js.snap new file mode 100644 index 0000000..28cc284 --- /dev/null +++ b/__tests__/scenes/Schedule/components/__snapshots__/NowButton.test.js.snap @@ -0,0 +1,80 @@ +exports[`Schedule - Now Button renders correctly 1`] = ` + + + + NOW + + + +`; diff --git a/__tests__/scenes/Schedule/components/__snapshots__/SplashScreen.test.js.snap b/__tests__/scenes/Schedule/components/__snapshots__/SplashScreen.test.js.snap new file mode 100644 index 0000000..849b26e --- /dev/null +++ b/__tests__/scenes/Schedule/components/__snapshots__/SplashScreen.test.js.snap @@ -0,0 +1,113 @@ +exports[`Schedule - Splash Screen renders correctly 1`] = ` + + + + + + + +`; + +exports[`Schedule - Splash Screen renders correctly in animated state 1`] = ` + + + + + + + +`; diff --git a/__tests__/scenes/Schedule/components/__snapshots__/Talk.test.js.snap b/__tests__/scenes/Schedule/components/__snapshots__/Talk.test.js.snap new file mode 100644 index 0000000..d0b5459 --- /dev/null +++ b/__tests__/scenes/Schedule/components/__snapshots__/Talk.test.js.snap @@ -0,0 +1,160 @@ +exports[`Schedule - Talk renders correctly 1`] = ` + + + + + + + — + + + + + + + + +  + + + + + +`; diff --git a/__tests__/scenes/Schedule/index.test.js b/__tests__/scenes/Schedule/index.test.js new file mode 100644 index 0000000..eee2fd0 --- /dev/null +++ b/__tests__/scenes/Schedule/index.test.js @@ -0,0 +1,15 @@ +import 'react-native'; +import React from 'react'; +import renderer from 'react-test-renderer'; + +import Schedule from '../../../app/scenes/Schedule'; + +describe('Schedule', () => { + it('renders correctly', () => { + const tree = renderer.create( + + ).toJSON(); + + expect(tree).toMatchSnapshot(); + }); +}); diff --git a/__tests__/scenes/Talk/__snapshots__/index.test.js.snap b/__tests__/scenes/Talk/__snapshots__/index.test.js.snap new file mode 100644 index 0000000..4b2829b --- /dev/null +++ b/__tests__/scenes/Talk/__snapshots__/index.test.js.snap @@ -0,0 +1,268 @@ +exports[`Talk renders correctly 1`] = ` + + + + + + + + + + + + Max Stoiber + + + (tap for more) + + + + + The Road to Styled Components + + + + + What if we took the best of JavaScript and the best of CSS, and combined them together to create the ultimate styling solution for React? Glen Maddern (CSS Modules co-creator) and I sat down and starting thinking about this. Let\'s talk about what we thought about and why we arrived where we did – 💅 styled-components. + + + + + + + + + + + + 9:30am + + + + + Share + + + + + +`; diff --git a/__tests__/scenes/Talk/components/Hint.test.js b/__tests__/scenes/Talk/components/Hint.test.js new file mode 100644 index 0000000..0c9ec11 --- /dev/null +++ b/__tests__/scenes/Talk/components/Hint.test.js @@ -0,0 +1,15 @@ +import 'react-native'; +import React from 'react'; +import renderer from 'react-test-renderer'; + +import Hint from '../../../../app/scenes/Talk/components/Hint'; + +describe('Talk - Hint', () => { + it('renders correctly', () => { + const tree = renderer.create( + + ).toJSON(); + + expect(tree).toMatchSnapshot(); + }); +}); diff --git a/__tests__/scenes/Talk/components/Pane.test.js b/__tests__/scenes/Talk/components/Pane.test.js new file mode 100644 index 0000000..73411bb --- /dev/null +++ b/__tests__/scenes/Talk/components/Pane.test.js @@ -0,0 +1,24 @@ +import 'react-native'; +import React from 'react'; +import renderer from 'react-test-renderer'; + +import Pane from '../../../../app/scenes/Talk/components/Pane'; +import talks from '../../../../app/data/talks'; + +describe('Talk - Pane', () => { + it('renders correctly', () => { + const tree = renderer.create( + {}} + onScroll={() => {}} + onScrollEndDrag={() => {}} + prevTalk={talks[0]} + showSpeakerModal={() => {}} + visibleTalk={talks[0]} + /> + ).toJSON(); + + expect(tree).toMatchSnapshot(); + }); +}); diff --git a/__tests__/scenes/Talk/components/Preview.test.js b/__tests__/scenes/Talk/components/Preview.test.js new file mode 100644 index 0000000..360c06e --- /dev/null +++ b/__tests__/scenes/Talk/components/Preview.test.js @@ -0,0 +1,33 @@ +import 'react-native'; +import React from 'react'; +import renderer from 'react-test-renderer'; + +import Preview from '../../../../app/scenes/Talk/components/Preview'; + +describe('Talk - Preview', () => { + it('renders correctly in top position', () => { + const tree = renderer.create( + + ).toJSON(); + + expect(tree).toMatchSnapshot(); + }); + + it('renders correctly in bottom position', () => { + const tree = renderer.create( + + ).toJSON(); + + expect(tree).toMatchSnapshot(); + }); +}); diff --git a/__tests__/scenes/Talk/components/Speaker.test.js b/__tests__/scenes/Talk/components/Speaker.test.js new file mode 100644 index 0000000..91e2011 --- /dev/null +++ b/__tests__/scenes/Talk/components/Speaker.test.js @@ -0,0 +1,34 @@ +import 'react-native'; +import React from 'react'; +import renderer from 'react-test-renderer'; + +import Speaker from '../../../../app/scenes/Talk/components/Speaker'; + +describe('Talk - Speaker', () => { + it('renders correctly with missing github and twitter', () => { + const tree = renderer.create( + {}} + summary="This is my summary." + /> + ).toJSON(); + + expect(tree).toMatchSnapshot(); + }); + it('renders correctly with all props', () => { + const tree = renderer.create( + {}} + summary="This is my summary." + twitter="twitter" + /> + ).toJSON(); + + expect(tree).toMatchSnapshot(); + }); +}); diff --git a/__tests__/scenes/Talk/components/__snapshots__/Hint.test.js.snap b/__tests__/scenes/Talk/components/__snapshots__/Hint.test.js.snap new file mode 100644 index 0000000..c623666 --- /dev/null +++ b/__tests__/scenes/Talk/components/__snapshots__/Hint.test.js.snap @@ -0,0 +1,65 @@ +exports[`Talk - Hint renders correctly 1`] = ` + + + +  + + + +`; diff --git a/__tests__/scenes/Talk/components/__snapshots__/Pane.test.js.snap b/__tests__/scenes/Talk/components/__snapshots__/Pane.test.js.snap new file mode 100644 index 0000000..bcf15ac --- /dev/null +++ b/__tests__/scenes/Talk/components/__snapshots__/Pane.test.js.snap @@ -0,0 +1,275 @@ +exports[`Talk - Pane renders correctly 1`] = ` + + + + + + The Road to Styled Components + + + 9:30am + — + Max Stoiber + + +  + + + + + + + + + + + Max Stoiber + + + (tap for more) + + + + + The Road to Styled Components + + + + + What if we took the best of JavaScript and the best of CSS, and combined them together to create the ultimate styling solution for React? Glen Maddern (CSS Modules co-creator) and I sat down and starting thinking about this. Let\'s talk about what we thought about and why we arrived where we did – 💅 styled-components. + + + + + +  + + + The Road to Styled Components + + + 9:30am + — + Max Stoiber + + + + + +`; diff --git a/__tests__/scenes/Talk/components/__snapshots__/Preview.test.js.snap b/__tests__/scenes/Talk/components/__snapshots__/Preview.test.js.snap new file mode 100644 index 0000000..ff44841 --- /dev/null +++ b/__tests__/scenes/Talk/components/__snapshots__/Preview.test.js.snap @@ -0,0 +1,133 @@ +exports[`Talk - Preview renders correctly in bottom position 1`] = ` + + +  + + + React Boilerplate + + + 9AM + — + Max Stroiber + + +`; + +exports[`Talk - Preview renders correctly in top position 1`] = ` + + + React Boilerplate + + + 9AM + — + Max Stroiber + + +  + + +`; diff --git a/__tests__/scenes/Talk/components/__snapshots__/Speaker.test.js.snap b/__tests__/scenes/Talk/components/__snapshots__/Speaker.test.js.snap new file mode 100644 index 0000000..f824db6 --- /dev/null +++ b/__tests__/scenes/Talk/components/__snapshots__/Speaker.test.js.snap @@ -0,0 +1,591 @@ +exports[`Talk - Speaker renders correctly with all props 1`] = ` + + + + + + + + + + + + + Max Stroiber + + + This is my summary. + + + +  + + + + + + + +  + + + @twitter + + + + + + +  + + + github + + + + + + + + +`; + +exports[`Talk - Speaker renders correctly with missing github and twitter 1`] = ` + + + + + + + + + + + + + Max Stroiber + + + This is my summary. + + + +  + + + + + + + +`; diff --git a/__tests__/scenes/Talk/index.test.js b/__tests__/scenes/Talk/index.test.js new file mode 100644 index 0000000..68d3827 --- /dev/null +++ b/__tests__/scenes/Talk/index.test.js @@ -0,0 +1,15 @@ +import 'react-native'; +import React from 'react'; +import renderer from 'react-test-renderer'; + +import Talk from '../../../app/scenes/Talk'; + +describe('Talk', () => { + it('renders correctly', () => { + const tree = renderer.create( + + ).toJSON(); + + expect(tree).toMatchSnapshot(); + }); +}); diff --git a/__tests__/setup.js b/__tests__/setup.js new file mode 100644 index 0000000..f256b30 --- /dev/null +++ b/__tests__/setup.js @@ -0,0 +1,17 @@ +import React from 'react'; +import { View } from 'react-native'; + +// ------------------------ +// React Native Built-Ins +// ------------------------ +// React Native UI Manager needs a focus function. +import { UIManager } from 'NativeModules'; +UIManager.focus = jest.fn(); +UIManager.createView = jest.fn(() => ); +UIManager.updateView = jest.fn(); + +// ------------------------ +// NPM Modules +// ------------------------ +// Provide a manual mock for native modules. +jest.mock('react-native-maps'); diff --git a/android/app/build.gradle b/android/app/build.gradle index 507b135..8bc6a24 100644 --- a/android/app/build.gradle +++ b/android/app/build.gradle @@ -10,14 +10,17 @@ import com.android.build.OutputFile * bundle directly from the development server. Below you can see all the possible configurations * and their defaults. If you decide to add a configuration block, make sure to add it before the * `apply from: "../../node_modules/react-native/react.gradle"` line. - * - * project.ext.react = [ - * // the name of the generated asset file containing your JS bundle - * bundleAssetName: "index.android.bundle", - * - * // the entry file for bundle generation - * entryFile: "index.android.js", - * + */ + + project.ext.react = [ + // the name of the generated asset file containing your JS bundle + bundleAssetName: "index.bundle", + + // the entry file for bundle generation + entryFile: "index.js", + ] + +/** * // whether to bundle JS and assets in debug mode * bundleInDebug: false, * diff --git a/app/scenes/Schedule/index.js b/app/scenes/Schedule/index.js index fbd7042..07a2483 100644 --- a/app/scenes/Schedule/index.js +++ b/app/scenes/Schedule/index.js @@ -78,7 +78,7 @@ export default class Schedule extends Component { componentDidMount () { // This is the actual image splash screen, not the animated one. - Splash.close({}); + if (Splash) Splash.close({}); } gotoEventInfo () { @@ -129,7 +129,7 @@ export default class Schedule extends Component { const { animatingSplash, dataSource, showNowButton } = this.state; const renderFooter = () => ( - + Event Info diff --git a/app/scenes/Talk/components/Preview/index.js b/app/scenes/Talk/components/Preview/index.js index 54f920c..9024abf 100644 --- a/app/scenes/Talk/components/Preview/index.js +++ b/app/scenes/Talk/components/Preview/index.js @@ -10,7 +10,7 @@ const ICON_VARIANT = { top: 'ios-arrow-down', }; -export default class NextUp extends Component { +export default class Preview extends Component { render () { const { position, @@ -54,7 +54,7 @@ export default class NextUp extends Component { } }; -NextUp.propTypes = { +Preview.propTypes = { position: PropTypes.oneOf(['bottom', 'top']), speakerName: PropTypes.string.isRequired, talkStartTime: PropTypes.string.isRequired, diff --git a/index.android.js b/index.android.js deleted file mode 100644 index 7f199e5..0000000 --- a/index.android.js +++ /dev/null @@ -1,4 +0,0 @@ -import ReactConf2017 from './app/ReactConf2017'; -import { AppRegistry } from 'react-native'; - -AppRegistry.registerComponent('ReactConf2017', () => ReactConf2017); diff --git a/index.ios.js b/index.js similarity index 96% rename from index.ios.js rename to index.js index 7f199e5..67ddca0 100644 --- a/index.ios.js +++ b/index.js @@ -1,4 +1,4 @@ import ReactConf2017 from './app/ReactConf2017'; import { AppRegistry } from 'react-native'; -AppRegistry.registerComponent('ReactConf2017', () => ReactConf2017); +AppRegistry.registerComponent('ReactConf2017', () => ReactConf2017); diff --git a/ios/ReactConf2017/AppDelegate.m b/ios/ReactConf2017/AppDelegate.m index ec907e1..c415512 100644 --- a/ios/ReactConf2017/AppDelegate.m +++ b/ios/ReactConf2017/AppDelegate.m @@ -23,7 +23,7 @@ - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:( #ifdef DEBUG - jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index.ios" fallbackResource:nil]; + jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil]; #else jsCodeLocation = [CodePush bundleURL]; #endif diff --git a/jsconfig.json b/jsconfig.json new file mode 100644 index 0000000..c98b6e0 --- /dev/null +++ b/jsconfig.json @@ -0,0 +1,9 @@ +{ + "compilerOptions": { + "allowJs": true, + "allowSyntheticDefaultImports": true + }, + "exclude": [ + "node_modules" + ] +} \ No newline at end of file diff --git a/package.json b/package.json index 7f3eaee..23a7706 100644 --- a/package.json +++ b/package.json @@ -1,35 +1,40 @@ { - "name": "ReactConf2017", - "version": "0.0.1", - "private": true, - "scripts": { - "start": "node_modules/react-native/packager/packager.sh", - "lint-fix": "npm run lint -- --fix", - "lint": "eslint .", - "test": "jest" - }, - "dependencies": { - "moment": "^2.17.1", - "react": "15.4.2", - "react-native": "^0.41.2", - "react-native-blur": "^2.0.0", - "react-native-code-push": "^1.17.0-beta", - "react-native-linear-gradient": "^2.0.0", - "react-native-maps": "airbnb/react-native-maps", - "react-native-smart-splash-screen": "^2.3.3", - "react-native-vector-icons": "^4.0.0" - }, - "devDependencies": { - "babel-jest": "18.0.0", - "babel-preset-react-native": "1.9.1", - "eslint": "^3.15.0", - "eslint-config-keystone": "^3.0.0", - "eslint-config-keystone-react": "^1.0.0", - "eslint-plugin-react": "^6.10.0", - "jest": "18.1.0", - "react-test-renderer": "15.4.2" - }, - "jest": { - "preset": "react-native" - } + "name": "ReactConf2017", + "version": "0.0.1", + "private": true, + "scripts": { + "start": "node_modules/react-native/packager/packager.sh", + "lint": "eslint .", + "lint-fix": "npm run lint -- --fix", + "test": "jest", + "update-snapshots": "jest -u" + }, + "dependencies": { + "moment": "^2.17.1", + "react": "15.4.2", + "react-native": "^0.41.2", + "react-native-blur": "^2.0.0", + "react-native-code-push": "^1.17.0-beta", + "react-native-linear-gradient": "^2.0.0", + "react-native-maps": "airbnb/react-native-maps", + "react-native-smart-splash-screen": "^2.3.3", + "react-native-vector-icons": "^4.0.0" + }, + "devDependencies": { + "babel-jest": "^19.0.0", + "babel-preset-react-native": "1.9.1", + "eslint": "^3.15.0", + "eslint-config-keystone": "^3.0.0", + "eslint-config-keystone-react": "^1.0.0", + "eslint-plugin-react": "^6.10.0", + "jest": "18.1.0", + "react-test-renderer": "15.4.2" + }, + "jest": { + "preset": "react-native", + "testRegex": "(/__tests__/.+\\.test\\.js$)", + "setupFiles": [ + "/__tests__/setup.js" + ] + } } diff --git a/yarn.lock b/yarn.lock index d8baad8..d7582b5 100644 --- a/yarn.lock +++ b/yarn.lock @@ -336,7 +336,7 @@ babel-helpers@^6.23.0: babel-runtime "^6.22.0" babel-template "^6.23.0" -babel-jest@18.0.0, babel-jest@^18.0.0: +babel-jest@^18.0.0: version "18.0.0" resolved "https://registry.yarnpkg.com/babel-jest/-/babel-jest-18.0.0.tgz#17ebba8cb3285c906d859e8707e4e79795fb65e3" dependencies: @@ -344,6 +344,14 @@ babel-jest@18.0.0, babel-jest@^18.0.0: babel-plugin-istanbul "^3.0.0" babel-preset-jest "^18.0.0" +babel-jest@^19.0.0: + version "19.0.0" + resolved "https://registry.yarnpkg.com/babel-jest/-/babel-jest-19.0.0.tgz#59323ced99a3a84d359da219ca881074ffc6ce3f" + dependencies: + babel-core "^6.0.0" + babel-plugin-istanbul "^4.0.0" + babel-preset-jest "^19.0.0" + babel-messages@^6.23.0: version "6.23.0" resolved "https://registry.yarnpkg.com/babel-messages/-/babel-messages-6.23.0.tgz#f3cdf4703858035b2a2951c6ec5edf6c62f2630e" @@ -371,10 +379,22 @@ babel-plugin-istanbul@^3.0.0: object-assign "^4.1.0" test-exclude "^3.3.0" +babel-plugin-istanbul@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/babel-plugin-istanbul/-/babel-plugin-istanbul-4.0.0.tgz#36bde8fbef4837e5ff0366531a2beabd7b1ffa10" + dependencies: + find-up "^2.1.0" + istanbul-lib-instrument "^1.4.2" + test-exclude "^4.0.0" + babel-plugin-jest-hoist@^18.0.0: version "18.0.0" resolved "https://registry.yarnpkg.com/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-18.0.0.tgz#4150e70ecab560e6e7344adc849498072d34e12a" +babel-plugin-jest-hoist@^19.0.0: + version "19.0.0" + resolved "https://registry.yarnpkg.com/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-19.0.0.tgz#4ae2a04ea612a6e73651f3fde52c178991304bea" + babel-plugin-react-transform@2.0.2: version "2.0.2" resolved "https://registry.yarnpkg.com/babel-plugin-react-transform/-/babel-plugin-react-transform-2.0.2.tgz#515bbfa996893981142d90b1f9b1635de2995109" @@ -701,6 +721,12 @@ babel-preset-jest@^18.0.0: dependencies: babel-plugin-jest-hoist "^18.0.0" +babel-preset-jest@^19.0.0: + version "19.0.0" + resolved "https://registry.yarnpkg.com/babel-preset-jest/-/babel-preset-jest-19.0.0.tgz#22d67201d02324a195811288eb38294bb3cac396" + dependencies: + babel-plugin-jest-hoist "^19.0.0" + babel-preset-react-native@1.9.1, babel-preset-react-native@^1.9.1: version "1.9.1" resolved "https://registry.yarnpkg.com/babel-preset-react-native/-/babel-preset-react-native-1.9.1.tgz#ec8e378274410d78f550fa9f8edd70353f3bb2fe" @@ -1740,6 +1766,12 @@ find-up@^1.0.0, find-up@^1.1.2: path-exists "^2.0.0" pinkie-promise "^2.0.0" +find-up@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/find-up/-/find-up-2.1.0.tgz#45d1b7e506c717ddd482775a2b77920a3c0c57a7" + dependencies: + locate-path "^2.0.0" + flat-cache@^1.2.1: version "1.2.2" resolved "https://registry.yarnpkg.com/flat-cache/-/flat-cache-1.2.2.tgz#fa86714e72c21db88601761ecf2f555d1abc6b96" @@ -2707,6 +2739,13 @@ load-json-file@^1.0.0: pinkie-promise "^2.0.0" strip-bom "^2.0.0" +locate-path@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/locate-path/-/locate-path-2.0.0.tgz#2b568b265eec944c6d9c0de9c3dbbbca0354cd8e" + dependencies: + p-locate "^2.0.0" + path-exists "^3.0.0" + lodash._arraycopy@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/lodash._arraycopy/-/lodash._arraycopy-3.0.0.tgz#76e7b7c1f1fb92547374878a562ed06a3e50f6e1" @@ -3204,6 +3243,16 @@ os-tmpdir@^1.0.0, os-tmpdir@^1.0.1, os-tmpdir@~1.0.1: version "1.0.2" resolved "https://registry.yarnpkg.com/os-tmpdir/-/os-tmpdir-1.0.2.tgz#bbe67406c79aa85c5cfec766fe5734555dfa1274" +p-limit@^1.1.0: + version "1.1.0" + resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-1.1.0.tgz#b07ff2d9a5d88bec806035895a2bab66a27988bc" + +p-locate@^2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/p-locate/-/p-locate-2.0.0.tgz#20a0103b222a70c8fd39cc2e580680f3dde5ec43" + dependencies: + p-limit "^1.1.0" + parse-glob@^3.0.4: version "3.0.4" resolved "https://registry.yarnpkg.com/parse-glob/-/parse-glob-3.0.4.tgz#b2c376cfb11f35513badd173ef0bb6e3a388391c" @@ -3233,6 +3282,10 @@ path-exists@^2.0.0: dependencies: pinkie-promise "^2.0.0" +path-exists@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-3.0.0.tgz#ce0ebeaa5f78cb18925ea7d810d7b59b010fd515" + path-is-absolute@^1.0.0: version "1.0.1" resolved "https://registry.yarnpkg.com/path-is-absolute/-/path-is-absolute-1.0.1.tgz#174b9268735534ffbc7ace6bf53a5a9e1b5c5f5f" @@ -4087,6 +4140,16 @@ test-exclude@^3.3.0: read-pkg-up "^1.0.1" require-main-filename "^1.0.1" +test-exclude@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/test-exclude/-/test-exclude-4.0.0.tgz#0ddc0100b8ae7e88b34eb4fd98a907e961991900" + dependencies: + arrify "^1.0.1" + micromatch "^2.3.11" + object-assign "^4.1.0" + read-pkg-up "^1.0.1" + require-main-filename "^1.0.1" + text-table@~0.2.0: version "0.2.0" resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4"