packages/brookjs-cli/features/__snaps__/developer-runs-new-with-ts-and-accepts-the-defaults.snap
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Developer runs new with ts and accepts the defaults-.beaverrc.ts 1`] = `
"export const dir = 'src';
"
`;
exports[`Developer runs new with ts and accepts the defaults-.storybook/.babelrc 1`] = `
"{
\\"presets\\": [\\"brookjs\\"]
}
"
`;
exports[`Developer runs new with ts and accepts the defaults-.storybook/main.js 1`] = `
"module.exports = {
stories: ['../src/**/__stories__/*.stories.tsx'],
addons: [
'@storybook/addon-actions',
'@storybook/addon-links',
'brookjs-desalinate/register'
],
webpack: async config => {
config.module.rules.push({
test: /\\\\.(ts|tsx)$/,
loader: require.resolve('babel-loader'),
options: {
presets: [['brookjs', { flow: false, typescript: true }]],
},
});
config.resolve.extensions.push('.ts', '.tsx');
return config;
},
};
"
`;
exports[`Developer runs new with ts and accepts the defaults-.storybook/main.ts 1`] = `
"module.exports = {
stories: ['../src/**/__stories__/*.stories.tsx'],
addons: [
'@storybook/addon-actions',
'@storybook/addon-links',
'brookjs-desalinate/register'
]
};
"
`;
exports[`Developer runs new with ts and accepts the defaults-package.json 1`] = `
"{
\\"name\\": \\"test-app\\",
\\"version\\": \\"0.0.0\\",
\\"description\\": \\"A brookjs application\\",
\\"main\\": \\"src/index.js\\",
\\"scripts\\": {
\\"build\\": \\"beaver build\\",
\\"start\\": \\"beaver start\\",
\\"test\\": \\"npm run test:check && npm run test:lint && npm run test:unit\\",
\\"test:check\\": \\"beaver test check\\",
\\"test:lint\\": \\"beaver test lint\\",
\\"test:unit\\": \\"beaver test unit --coverage\\",
\\"storybook:start\\": \\"start-storybook -p 6006\\",
\\"storybook:build\\": \\"build-storybook\\"
},
\\"keywords\\": [],
\\"author\\": \\"\\",
\\"license\\": \\"MIT\\",
\\"devDependencies\\": {
\\"@storybook/addon-actions\\": \\"^5.0.0\\",
\\"@storybook/addon-links\\": \\"^5.0.0\\",
\\"@storybook/addon-storyshots\\": \\"^5.3.6\\",
\\"@storybook/addons\\": \\"^5.0.0\\",
\\"@storybook/react\\": \\"^5.0.0\\",
\\"@testing-library/react\\": \\"^10.0.0\\",
\\"@testing-library/jest-dom\\": \\"^5.0.0\\",
\\"brookjs-cli\\": \\"^1.0.0-alpha\\",
\\"brookjs-desalinate\\": \\"^1.0.0-alpha\\"
},
\\"dependencies\\": {
\\"brookjs\\": \\"^1.0.0-alpha\\",
\\"kefir\\": \\"^3.8.0\\",
\\"react\\": \\"^16.0.0\\",
\\"react-dom\\": \\"^16.0.0\\",
\\"react-redux\\": \\"^7.0.0\\",
\\"redux\\": \\"^4.0.0\\",
\\"reselect\\": \\"^4.0.0\\",
\\"typesafe-actions\\": \\"^5.0.0\\",
\\"typescript\\": \\"^3.7.0\\"
}
}
"
`;
exports[`Developer runs new with ts and accepts the defaults-public/index.html 1`] = `
"<!DOCTYPE html>
<html lang=\\"en\\">
<head>
<meta charset=\\"utf-8\\" />
<link rel=\\"icon\\" href=\\"%PUBLIC_URL%/favicon.ico\\" />
<meta name=\\"viewport\\" content=\\"width=device-width, initial-scale=1\\" />
<meta name=\\"theme-color\\" content=\\"#000000\\" />
<meta name=\\"description\\" content=\\"Web site created using brookjs\\" />
<!--
manifest.json provides metadata used when your web app is installed on a
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<link rel=\\"manifest\\" href=\\"%PUBLIC_URL%/manifest.json\\" />
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the \`public\` folder during the build.
Only files inside the \`public\` folder can be referenced from the HTML.
Unlike \\"/favicon.ico\\" or \\"favicon.ico\\", \\"%PUBLIC_URL%/favicon.ico\\" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running \`npm run build\`.
-->
<title>brookjs App</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id=\\"root\\"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run \`npm start\` or \`yarn start\`.
To create a production bundle, use \`npm run build\` or \`yarn build\`.
-->
</body>
</html>
"
`;
exports[`Developer runs new with ts and accepts the defaults-public/manifest.json 1`] = `
"{
\\"short_name\\": \\"test-app\\",
\\"name\\": \\"A brookjs application\\",
\\"icons\\": [
{
\\"src\\": \\"favicon.ico\\",
\\"sizes\\": \\"64x64 32x32 24x24 16x16\\",
\\"type\\": \\"image/x-icon\\"
},
{
\\"src\\": \\"logo192.png\\",
\\"type\\": \\"image/png\\",
\\"sizes\\": \\"192x192\\"
},
{
\\"src\\": \\"logo512.png\\",
\\"type\\": \\"image/png\\",
\\"sizes\\": \\"512x512\\"
}
],
\\"start_url\\": \\".\\",
\\"display\\": \\"standalone\\",
\\"theme_color\\": \\"#000000\\",
\\"background_color\\": \\"#ffffff\\"
}
"
`;
exports[`Developer runs new with ts and accepts the defaults-src/__tests__/storyshots.spec.ts 1`] = `
"import initStoryshots from '@storybook/addon-storyshots';
import { render } from '@testing-library/react';
import { RootJunction } from 'brookjs-silt';
const reactTestingLibrarySerializer = {
print: (val, serialize) => serialize(val.container.firstChild),
test: val => val && val.hasOwnProperty('container'),
};
initStoryshots({
framework: 'react',
renderer: element =>
render(element, {
wrapper: RootJunction,
}),
snapshotSerializers: [reactTestingLibrarySerializer],
});
"
`;
exports[`Developer runs new with ts and accepts the defaults-src/actions/app.ts 1`] = `
"import { createAction } from 'typesafe-actions';
export const init = createAction('INIT')();
export const incrementClick = createAction('INCREMENT_CLICK')();
export const decrementClick = createAction('DECREMENT_CLICK')();
"
`;
exports[`Developer runs new with ts and accepts the defaults-src/actions/index.ts 1`] = `
"export * from './app';
"
`;
exports[`Developer runs new with ts and accepts the defaults-src/components/__stories__/App.stories.tsx 1`] = `
"import React from 'react';
import App from '../App';
export default {
title: 'App',
};
export const basic = () => <App count={3} />;
"
`;
exports[`Developer runs new with ts and accepts the defaults-src/components/__tests__/App.spec.tsx 1`] = `
"import React from 'react';
import { fireEvent } from '@testing-library/react';
import { incrementClick, decrementClick } from '../../actions';
import App from '../App';
describe('App', () => {
it('should emit actions', () => {
expect(<App count={3} />).toEmitFromJunction(
[
[0, KTU.value(incrementClick())],
[0, KTU.value(decrementClick())],
],
api => {
fireEvent.click(api.getByText('+'));
fireEvent.click(api.getByText('-'));
},
);
});
});
"
`;
exports[`Developer runs new with ts and accepts the defaults-src/components/App.tsx 1`] = `
"import React from 'react';
import { toJunction } from 'brookjs-silt';
import { incrementClick, decrementClick } from '../actions';
type Props = {
count: number;
onIncrementClick: () => void;
onDecrementClick: () => void;
};
const App: React.FC<Props> = ({
count,
onIncrementClick,
onDecrementClick,
}) => {
return (
<div className=\\"test-app\\">
<h1>
Welcome to <code>brookjs</code>!<p>Count: {count}</p>
<div>
<button onClick={onIncrementClick}>+</button>
<button onClick={onDecrementClick}>-</button>
</div>
</h1>
</div>
);
};
const events = {
onIncrementClick: e$ => e$.map(() => incrementClick()),
onDecrementClick: e$ => e$.map(() => decrementClick()),
};
export default toJunction(events)(App);
"
`;
exports[`Developer runs new with ts and accepts the defaults-src/components/index.ts 1`] = `
"export { default as App } from './App';
"
`;
exports[`Developer runs new with ts and accepts the defaults-src/deltas/index.tsx 1`] = `
"import Kefir from 'kefir';
import { sampleByAction } from 'brookjs';
import { init } from '../actions';
export const rootDelta = (action$, state$) => {
const init$ = state$.thru(sampleByAction(action$, init)).flatMap(() => {
console.log('App initialized');
return Kefir.never();
});
return Kefir.merge([init$]);
};
"
`;
exports[`Developer runs new with ts and accepts the defaults-src/index.tsx 1`] = `
"import React from 'react';
import { createStore } from 'brookjs';
import { RootJunction } from 'brookjs-silt';
import ReactDOM from 'react-dom';
import { Store, Unsubscribe } from 'redux';
import { init } from './actions';
import { App } from './components';
import { rootDelta } from './deltas';
import { reducer, mapStateToProps, State } from './state';
let store: Store<State>;
let root$: React.ComponentProps<typeof RootJunction>['root$'];
let unsub: Unsubscribe;
const render = () => {
ReactDOM.render(
<RootJunction root$={root$}>
<App {...mapStateToProps(store.getState())} />
</RootJunction>,
document.getElementById('root'),
);
};
const bootstrap = (initialState?: State) => {
unsub && unsub();
store = createStore(reducer, initialState, rootDelta);
root$ = root$ => root$.observe(store.dispatch);
unsub = store.subscribe(render);
};
bootstrap();
store.dispatch(init());
if (module.hot) {
// Nothing needs to be done when the actions change.
module.hot.accept('./actions');
// Rerender if the components change.
module.hot.accept('./components', render);
// Update the store
module.hot.accept(['./deltas', './state'], () => bootstrap(store.getState()));
}
"
`;
exports[`Developer runs new with ts and accepts the defaults-src/setupTests.ts 1`] = `
"import 'brookjs-desalinate/extend-expect';
import '@testing-library/jest-dom/extend-expect';
"
`;
exports[`Developer runs new with ts and accepts the defaults-src/state/__tests__/state.spec.ts 1`] = `
"import { reducer, mapStateToProps } from '../index';
import { init, incrementClick, decrementClick } from '../../actions';
describe('state', () => {
describe('reducer', () => {
it('should return the initial state on init action', () => {
expect(reducer({ count: 0 }, init())).toEqual({ count: 0 });
});
it('should increase the count on increment click', () => {
expect(reducer({ count: 0 }, incrementClick())).toEqual({ count: 1 });
});
it('should increase the count on decrement click', () => {
expect(reducer({ count: 0 }, decrementClick())).toEqual({ count: -1 });
});
});
describe('mapStateToProps', () => {
it('should select the count', () => {
expect(mapStateToProps({ count: 20 })).toEqual({ count: 20 });
});
});
});
"
`;
exports[`Developer runs new with ts and accepts the defaults-src/state/index.ts 1`] = `
"import { createReducer, getType } from 'typesafe-actions';
import { incrementClick, decrementClick } from '../actions';
export type State = {
count: number;
};
const initialState = {
count: 0,
};
export const reducer = createReducer<State>(initialState, {
[getType(incrementClick)]: state => ({ ...state, count: state.count + 1 }),
[getType(decrementClick)]: state => ({ ...state, count: state.count - 1 }),
});
export const mapStateToProps = state => ({
count: state.count,
});
"
`;
exports[`Developer runs new with ts and accepts the defaults-tsconfig.json 1`] = `
"{
\\"compilerOptions\\": {
\\"target\\": \\"es5\\",
\\"lib\\": [\\"dom\\", \\"dom.iterable\\", \\"esnext\\"],
\\"allowJs\\": true,
\\"skipLibCheck\\": true,
\\"esModuleInterop\\": true,
\\"allowSyntheticDefaultImports\\": true,
\\"strict\\": true,
\\"forceConsistentCasingInFileNames\\": true,
\\"module\\": \\"esnext\\",
\\"moduleResolution\\": \\"node\\",
\\"resolveJsonModule\\": true,
\\"isolatedModules\\": true,
\\"noEmit\\": true,
\\"jsx\\": \\"react\\"
}
}
"
`;