Skip to content

Commit

Permalink
Merge pull request #13 from gregoranders/development
Browse files Browse the repository at this point in the history
Merge with Development
  • Loading branch information
gregoranders authored Jun 11, 2020
2 parents 03ef7c2 + d3a94df commit 2f6dc52
Show file tree
Hide file tree
Showing 14 changed files with 173 additions and 160 deletions.
2 changes: 1 addition & 1 deletion .github/workflows/release.yml
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ name: Release CI
on:
release:
types:
- created
- edited

jobs:
build:
Expand Down
10 changes: 5 additions & 5 deletions e2e/setup.ts
Original file line number Diff line number Diff line change
@@ -1,16 +1,16 @@
import { configureToMatchImageSnapshot } from 'jest-image-snapshot';
import 'expect-puppeteer';
import fs from 'fs';
import path from 'path';
import { existsSync, mkdirSync } from 'fs';
import { join } from 'path';
import { version } from '../package.json';
// eslint-disable-next-line @typescript-eslint/no-var-requires
const jestPuppeteerConfig = require('../jest-puppeteer.config.js');

export const timeout = 10000;
export const url = `http://127.0.0.1:${jestPuppeteerConfig.server.port}`;

export const customSnapshotsDir = path.join('e2e', 'screenshots', version);
export const customDiffDir = path.join(customSnapshotsDir, 'diff');
export const customSnapshotsDir = join('e2e', 'screenshots', version);
export const customDiffDir = join(customSnapshotsDir, 'diff');

const customConfig = { threshold: 0.5 };
const toMatchImageSnapshot = configureToMatchImageSnapshot({
Expand All @@ -22,5 +22,5 @@ const toMatchImageSnapshot = configureToMatchImageSnapshot({
expect.extend({ toMatchImageSnapshot });

export const mkdir = (path: string): void => {
if (!fs.existsSync(path)) fs.mkdirSync(path);
if (!existsSync(path)) mkdirSync(path);
};
146 changes: 8 additions & 138 deletions e2e/webpack.config.js
Original file line number Diff line number Diff line change
@@ -1,140 +1,10 @@
/* eslint-disable @typescript-eslint/no-var-requires */
'use strict';
const path = require('path');
const CaseSensitivePlugin = require('case-sensitive-paths-webpack-plugin');
const CleanPlugin = require('clean-webpack-plugin').CleanWebpackPlugin;
const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const webpack = require('webpack');
const plugins = [
new CaseSensitivePlugin(),
new CleanPlugin(),
new HtmlWebpackPlugin({
filename: 'index.html',
title: 'TypeScript React Redux Webpack Demo',
template: path.join('./public', 'webpack.html'),
}),
new MiniCssExtractPlugin({
filename: 'css/[name].css',
chunkFilename: 'css/[name].css',
}),
new webpack.ProgressPlugin(),
];
const cssLoaders = [
{
loader: 'css-loader',
},
{
loader: 'sass-loader',
options: {
sassOptions: { includePaths: ['node_modules'] },
},
},
];
const sassLoaders = cssLoaders.concat([
{
loader: 'sass-loader',
options: {
sassOptions: { includePaths: ['node_modules'] },
},
},
]);
const config = require('../webpack.config.js');

module.exports = {
mode: 'production',
entry: {
index: path.resolve(path.join('src', 'script', 'index.tsx')),
styles: path.resolve(path.join('src', 'style', 'styles.scss')),
},
output: {
path: path.resolve('./dist'),
filename: 'js/[name].bundle.js',
},
optimization: {
minimize: false,
runtimeChunk: {
name: 'runtime',
},
splitChunks: {
cacheGroups: {
commons: {
chunks: 'initial',
minChunks: 2,
maxInitialRequests: 5,
minSize: 0,
},
vendor: {
test: /node_modules/,
chunks: 'initial',
name: 'vendor',
priority: 10,
enforce: true,
},
},
},
},
performance: {
maxEntrypointSize: 2000000,
maxAssetSize: 2000000,
},
resolve: {
extensions: ['.ts', '.tsx', '.scss', '.js'],
alias: {
'@models': path.resolve('src/script/models'),
'@atoms': path.resolve('src/script/components/atoms'),
'@organisms': path.resolve('src/script/components/organisms'),
'@molecules': path.resolve('src/script/components/molecules'),
'@pages': path.resolve('src/script/components/pages'),
'@components': path.resolve('src/script/components'),
'@app': path.resolve('src/script'),
'./fonts': 'node_modules/@fortawesome/fontawesome-free/webfonts',
},
},
module: {
rules: [
{
test: /\.tsx?$/,
loader: 'ts-loader',
},
{
test: /\.s[a|c]ss$/,
use: [MiniCssExtractPlugin.loader].concat(sassLoaders),
},
{
test: /\.css$/,
use: [MiniCssExtractPlugin.loader].concat(cssLoaders),
},
{
test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: 'images/[name].[ext]',
},
},
{
test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: 'media/[name].[ext]',
},
},
{
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
loader: 'url-loader',
options: {
limit: 10000,
name: 'fonts/[name].[ext]',
},
},
],
},
devServer: {
historyApiFallback: true,
host: '0.0.0.0',
port: 7683,
hot: false,
inline: false,
},
plugins: plugins,
};
config.devServer.hot = false;
config.devServer.inline = false;
config.devServer.stats = 'none';
config.stats = 'none';

module.exports = config;
4 changes: 4 additions & 0 deletions findport.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
import { getPort } from 'portfinder-sync';
import { baseport } from './package.json';

console.log(getPort(baseport));
12 changes: 7 additions & 5 deletions jest-puppeteer.config.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
// eslint-disable-next-line @typescript-eslint/no-var-requires
const webpackConfig = require('./e2e/webpack.config.js');
/* eslint-disable @typescript-eslint/no-var-requires */
const cmd = `cross-env-shell NODE_PORT=${process.env.NODE_PORT}`;
const command = `${cmd} && npm run ${process.env.NODE_E2E === 'esm' ? 'serve' : 'e2e:serve'}`;

module.exports = {
browser: 'chromium',
browserContext: 'default',
Expand All @@ -8,9 +10,9 @@ module.exports = {
headless: process.env.HEADLESS !== 'false',
},
server: {
command: `npm run e2e:serve`,
port: webpackConfig.devServer.port,
command,
port: process.env.NODE_PORT,
launchTimeout: 10000,
debug: false,
debug: true,
},
};
17 changes: 13 additions & 4 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "ts-react-playground",
"version": "0.0.2",
"version": "0.0.3",
"description": "TypeScript React Playground",
"scripts": {
"start": "webpack-dev-server --open --progress --config webpack.config.js",
Expand All @@ -14,8 +14,10 @@
"build:webpack": "cross-env NODE_ENV=production webpack --config webpack.config.js",
"test": "jest --runInBand --env=enzyme --setupFilesAfterEnv=jest-enzyme --reporters=jest-spec-reporter jest-junit --coverage --coverageDirectory ../coverage --rootDir ./src",
"test:update": "npm run test -- -u",
"e2e:serve": "cross-env NODE_ENV=production webpack-dev-server --silent --quiet --liveReload false --inline false --config ./e2e/webpack.config.js",
"e2e": "jest --testTimeout=60000 --runInBand --preset=jest-puppeteer --coverage --coverageDirectory ../coverage-e2e --rootDir ./e2e",
"e2e:serve": "webpack-dev-server --config ./e2e/webpack.config.js --quiet true --liveReload false --inline false",
"e2e": "cross-env-shell NODE_PORT=$(ts-node findport.ts) NODE_E2E=webpack jest --testTimeout=60000 --runInBand --reporters=jest-spec-reporter --preset=jest-puppeteer --coverage --coverageDirectory ../coverage-e2e --rootDir ./e2e",
"serve": "ts-node server.ts",
"e2e:esm": "cross-env-shell NODE_PORT=$(ts-node findport.ts) NODE_E2E=esm jest --testTimeout=60000 --runInBand --reporters=jest-spec-reporter --preset=jest-puppeteer --coverage --coverageDirectory ../coverage-e2e --rootDir ./e2e",
"livereload": "livereloadx -a ./public",
"prescript": "rimraf ./public/script",
"script": "tsc --project ./src/script --outDir ./public/script",
Expand Down Expand Up @@ -62,6 +64,7 @@
"typescript",
"workbox"
],
"baseport": 43795,
"husky": {
"hooks": {
"pre-commit": "lint-staged && npm run test",
Expand Down Expand Up @@ -205,21 +208,23 @@
"@storybook/cli": "5.3.19",
"@storybook/react": "5.3.19",
"@storybook/theming": "5.3.19",
"@types/compression": "1.7.0",
"@types/d3-array": "2.0.0",
"@types/d3-format": "1.3.1",
"@types/d3-interpolate": "1.3.1",
"@types/d3-scale": "2.2.0",
"@types/d3-time-format": "2.1.1",
"@types/enzyme": "3.10.5",
"@types/enzyme-adapter-react-16": "1.0.6",
"@types/express": "4.17.6",
"@types/faker": "4.1.12",
"@types/jest": "26.0.0",
"@types/jest-image-snapshot": "3.1.0",
"@types/node": "14.0.13",
"@types/object-assign": "4.0.30",
"@types/prop-types": "15.7.3",
"@types/puppeteer": "3.0.0",
"@types/react": "16.9.35",
"@types/react": "16.9.36",
"@types/react-dom": "16.9.8",
"@types/react-is": "16.7.1",
"@types/react-router-dom": "5.1.5",
Expand All @@ -236,6 +241,7 @@
"breakpoint-sass": "2.7.1",
"case-sensitive-paths-webpack-plugin": "2.3.0",
"clean-webpack-plugin": "3.0.0",
"compression": "1.7.4",
"copy-dir": "1.3.0",
"cross-env": "7.0.2",
"css-loader": "3.5.3",
Expand All @@ -246,6 +252,7 @@
"eslint-plugin-prettier": "3.1.3",
"eslint-plugin-react": "7.20.0",
"eslint-plugin-react-hooks": "4.0.4",
"express": "4.17.1",
"faker": "4.1.0",
"file-loader": "6.0.0",
"html-webpack-plugin": "4.3.0",
Expand All @@ -264,13 +271,15 @@
"mini-css-extract-plugin": "0.9.0",
"minify": "5.1.1",
"node-sass": "4.14.1",
"portfinder-sync": "0.0.2",
"prettier": "2.0.5",
"puppeteer": "3.3.0",
"react-docgen-typescript-loader": "3.7.2",
"react-test-renderer": "16.13.1",
"rimraf": "3.0.2",
"rollup": "2.15.0",
"sass-loader": "8.0.2",
"source-map": "0.7.3",
"ts-jest": "26.1.0",
"ts-loader": "7.0.5",
"ts-node": "8.10.2",
Expand Down
40 changes: 40 additions & 0 deletions server.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
// import * as fs from 'fs';
import * as path from 'path';

import * as express from 'express';
import * as https from 'http';
import * as compression from 'compression';

import { baseport } from './package.json';

// import { api } from './controller';
const hostname = 'localhost';
const staticPath: string = path.join(__dirname, 'public');

const application = express();

application.set('port', process.env.NODE_PORT || baseport);
application.use(compression());
application.use('/ts-react-playground', express.static(staticPath));

// application.get('/api/*', api);

application.use((req: express.Request, res: express.Response) => {
console.log(req.url);
res.sendFile(path.join(staticPath, 'index.html'));
});

const httpOptions = {
// key: fs.readFileSync(path.resolve(__dirname, 'certs', 'key.pem')),
// cert: fs.readFileSync(path.resolve(__dirname, 'certs', 'cert.pem')),
};

https.createServer(httpOptions, application).listen(application.get('port'), () => {
console.log(
` App is running at http://${hostname}:%d in %s mode (%s) (%s)`,
application.get('port'),
application.get('env'),
staticPath,
);
console.log(' Press CTRL-C to stop\n');
});
9 changes: 8 additions & 1 deletion src/script/components/atoms/user/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,14 @@ type Props = {
user: User;
};

export const UserView: FunctionComponent<Props> = ({ user }) => {
/**
* UserView
*
* @description User view
*
* @param {User} user
*/
export const UserView: FunctionComponent<Props> = ({ user }: Props) => {
return (
<dl>
<dt>First Name</dt>
Expand Down
2 changes: 1 addition & 1 deletion src/script/components/organisms/users/index.spec.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,6 @@ describe(`${TestSubject.UsersModelView.displayName}`, () => {
</RecoilRoot>,
);
testSubject.find('button').simulate('click');
expect(testSubject.text()).toBe('Generate Users [0]');
expect(testSubject.text()).toContain('Generate Users [100]');
});
});
4 changes: 2 additions & 2 deletions src/script/components/organisms/users/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@ export const UsersModelView: FunctionComponent = () => {
const [users, setUsers] = useRecoilState(UsersAtom);
const usersLength = useRecoilValue(UsersLength);

const generateUsers = async () => {
setUsers(await generate());
const generateUsers = () => {
setUsers(generate());
};

return (
Expand Down
Loading

0 comments on commit 2f6dc52

Please sign in to comment.