Skip to content

Commit eb3e401

Browse files
mjacksonmjackson
committed
Just Use Prettier™
1 parent b9046ea commit eb3e401

File tree

7 files changed

+149
-137
lines changed

7 files changed

+149
-137
lines changed

‎modules/Media.js‎

Lines changed: 18 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import React from "react"
2-
import PropTypes from "prop-types"
3-
import json2mq from "json2mq"
1+
import React from "react";
2+
import PropTypes from "prop-types";
3+
import json2mq from "json2mq";
44

55
/**
66
* Conditionally renders based on whether or not a media query matches.
@@ -15,37 +15,37 @@ class Media extends React.Component {
1515
]).isRequired,
1616
render: PropTypes.func,
1717
children: PropTypes.oneOfType([PropTypes.node, PropTypes.func])
18-
}
18+
};
1919

2020
static defaultProps = {
2121
defaultMatches: true
22-
}
22+
};
2323

2424
state = {
2525
matches: this.props.defaultMatches
26-
}
26+
};
2727

28-
updateMatches = () => this.setState({ matches: this.mediaQueryList.matches })
28+
updateMatches = () => this.setState({ matches: this.mediaQueryList.matches });
2929

3030
componentWillMount() {
31-
if (typeof window !== "object") return
31+
if (typeof window !== "object") return;
3232

33-
let { query } = this.props
33+
let { query } = this.props;
3434

35-
if (typeof query !== "string") query = json2mq(query)
35+
if (typeof query !== "string") query = json2mq(query);
3636

37-
this.mediaQueryList = window.matchMedia(query)
38-
this.mediaQueryList.addListener(this.updateMatches)
39-
this.updateMatches()
37+
this.mediaQueryList = window.matchMedia(query);
38+
this.mediaQueryList.addListener(this.updateMatches);
39+
this.updateMatches();
4040
}
4141

4242
componentWillUnmount() {
43-
this.mediaQueryList.removeListener(this.updateMatches)
43+
this.mediaQueryList.removeListener(this.updateMatches);
4444
}
4545

4646
render() {
47-
const { children, render } = this.props
48-
const { matches } = this.state
47+
const { children, render } = this.props;
48+
const { matches } = this.state;
4949

5050
return render
5151
? matches ? render() : null
@@ -55,8 +55,8 @@ class Media extends React.Component {
5555
: !Array.isArray(children) || children.length // Preact defaults to empty children array
5656
? matches ? React.Children.only(children) : null
5757
: null
58-
: null
58+
: null;
5959
}
6060
}
6161

62-
export default Media
62+
export default Media;

‎modules/__tests__/Media-test.js‎

Lines changed: 66 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -1,136 +1,140 @@
1-
import React from "react"
2-
import ReactDOM from "react-dom"
3-
import ReactDOMServer from "react-dom/server"
4-
import Media from "../Media"
1+
import React from "react";
2+
import ReactDOM from "react-dom";
3+
import ReactDOMServer from "react-dom/server";
4+
import Media from "../Media";
55

66
const createMockMediaMatcher = matches => () => ({
77
matches,
88
addListener: () => {},
99
removeListener: () => {}
10-
})
10+
});
1111

1212
describe("A <Media>", () => {
13-
let originalMatchMedia
13+
let originalMatchMedia;
1414
beforeEach(() => {
15-
originalMatchMedia = window.matchMedia
16-
})
15+
originalMatchMedia = window.matchMedia;
16+
});
1717

1818
afterEach(() => {
19-
window.matchMedia = originalMatchMedia
20-
})
19+
window.matchMedia = originalMatchMedia;
20+
});
2121

22-
let node
22+
let node;
2323
beforeEach(() => {
24-
node = document.createElement("div")
25-
})
24+
node = document.createElement("div");
25+
});
2626

2727
describe("with a query that matches", () => {
2828
beforeEach(() => {
29-
window.matchMedia = createMockMediaMatcher(true)
30-
})
29+
window.matchMedia = createMockMediaMatcher(true);
30+
});
3131

3232
describe("and a children element", () => {
3333
it("renders its child", () => {
3434
const element = (
3535
<Media query="">
3636
<div>hello</div>
3737
</Media>
38-
)
38+
);
3939

4040
ReactDOM.render(element, node, () => {
41-
expect(node.firstChild.innerHTML).toMatch(/hello/)
42-
})
43-
})
44-
})
41+
expect(node.firstChild.innerHTML).toMatch(/hello/);
42+
});
43+
});
44+
});
4545

4646
describe("and a children function", () => {
4747
it("renders its child", () => {
4848
const element = (
49-
<Media query="">{matches => (matches ? <div>hello</div> : <div>goodbye</div>)}</Media>
50-
)
49+
<Media query="">
50+
{matches => (matches ? <div>hello</div> : <div>goodbye</div>)}
51+
</Media>
52+
);
5153

5254
ReactDOM.render(element, node, () => {
53-
expect(node.firstChild.innerHTML).toMatch(/hello/)
54-
})
55-
})
56-
})
55+
expect(node.firstChild.innerHTML).toMatch(/hello/);
56+
});
57+
});
58+
});
5759

5860
describe("and a render function", () => {
5961
it("renders its child", () => {
60-
const element = <Media query="" render={() => <div>hello</div>} />
62+
const element = <Media query="" render={() => <div>hello</div>} />;
6163

6264
ReactDOM.render(element, node, () => {
63-
expect(node.firstChild.innerHTML).toMatch(/hello/)
64-
})
65-
})
66-
})
67-
})
65+
expect(node.firstChild.innerHTML).toMatch(/hello/);
66+
});
67+
});
68+
});
69+
});
6870

6971
describe("with a query that does not match", () => {
7072
beforeEach(() => {
71-
window.matchMedia = createMockMediaMatcher(false)
72-
})
73+
window.matchMedia = createMockMediaMatcher(false);
74+
});
7375

7476
describe("and a children element", () => {
7577
it("renders its child", () => {
7678
const element = (
7779
<Media query="">
7880
<div>hello</div>
7981
</Media>
80-
)
82+
);
8183

8284
ReactDOM.render(element, node, () => {
83-
expect(node.firstChild.innerHTML || "").not.toMatch(/hello/)
84-
})
85-
})
86-
})
85+
expect(node.firstChild.innerHTML || "").not.toMatch(/hello/);
86+
});
87+
});
88+
});
8789

8890
describe("and a children function", () => {
8991
it("renders its child", () => {
9092
const element = (
91-
<Media query="">{matches => (matches ? <div>hello</div> : <div>goodbye</div>)}</Media>
92-
)
93+
<Media query="">
94+
{matches => (matches ? <div>hello</div> : <div>goodbye</div>)}
95+
</Media>
96+
);
9397

9498
ReactDOM.render(element, node, () => {
95-
expect(node.firstChild.innerHTML).toMatch(/goodbye/)
96-
})
97-
})
98-
})
99+
expect(node.firstChild.innerHTML).toMatch(/goodbye/);
100+
});
101+
});
102+
});
99103

100104
describe("and a render function", () => {
101105
it("does not render", () => {
102-
let renderWasCalled = false
106+
let renderWasCalled = false;
103107
const element = (
104108
<Media
105109
query=""
106110
render={() => {
107-
renderWasCalled = true
108-
return <div>hello</div>
111+
renderWasCalled = true;
112+
return <div>hello</div>;
109113
}}
110114
/>
111-
)
115+
);
112116

113117
ReactDOM.render(element, node, () => {
114-
expect(node.firstChild.innerHTML || "").not.toMatch(/hello/)
115-
expect(renderWasCalled).toBe(false)
116-
})
117-
})
118-
})
119-
})
118+
expect(node.firstChild.innerHTML || "").not.toMatch(/hello/);
119+
expect(renderWasCalled).toBe(false);
120+
});
121+
});
122+
});
123+
});
120124

121125
describe("rendered on the server", () => {
122126
beforeEach(() => {
123-
window.matchMedia = createMockMediaMatcher(true)
124-
})
127+
window.matchMedia = createMockMediaMatcher(true);
128+
});
125129

126130
it("renders its child", () => {
127131
const markup = ReactDOMServer.renderToStaticMarkup(
128132
<Media query="">
129133
<div>hello</div>
130134
</Media>
131-
)
135+
);
132136

133-
expect(markup).toMatch(/hello/)
134-
})
135-
})
136-
})
137+
expect(markup).toMatch(/hello/);
138+
});
139+
});
140+
});

‎modules/index.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
/* eslint-env node */
2-
import Media from "./Media"
2+
import Media from "./Media";
33

44
// TODO: Remove in the next major release.
5-
Media.Media = Media
5+
Media.Media = Media;
66

7-
module.exports = Media
7+
module.exports = Media;

‎package.json‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -62,9 +62,5 @@
6262
"query",
6363
"css",
6464
"responsive"
65-
],
66-
"prettier": {
67-
"printWidth": 100,
68-
"semi": false
69-
}
65+
]
7066
}

‎scripts/build.js‎

Lines changed: 28 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,47 @@
1-
const fs = require("fs")
2-
const path = require("path")
3-
const execSync = require("child_process").execSync
4-
const prettyBytes = require("pretty-bytes")
5-
const pascalCase = require("pascal-case")
6-
const gzipSize = require("gzip-size")
1+
const fs = require("fs");
2+
const path = require("path");
3+
const execSync = require("child_process").execSync;
4+
const prettyBytes = require("pretty-bytes");
5+
const pascalCase = require("pascal-case");
6+
const gzipSize = require("gzip-size");
77

8-
process.chdir(path.resolve(__dirname, ".."))
8+
process.chdir(path.resolve(__dirname, ".."));
99

1010
const exec = (command, extraEnv) =>
1111
execSync(command, {
1212
stdio: "inherit",
1313
env: Object.assign({}, process.env, extraEnv)
14-
})
14+
});
1515

16-
const packageName = require("../package").name
16+
const packageName = require("../package").name;
1717

18-
console.log("\nBuilding ES modules...")
18+
console.log("\nBuilding ES modules...");
1919

20-
exec(`rollup -c scripts/config.js -f es -o esm/${packageName}.js`)
20+
exec(`rollup -c scripts/config.js -f es -o esm/${packageName}.js`);
2121

22-
console.log("\nBuilding CommonJS modules...")
22+
console.log("\nBuilding CommonJS modules...");
2323

24-
exec(`rollup -c scripts/config.js -f cjs -o cjs/${packageName}.js`)
24+
exec(`rollup -c scripts/config.js -f cjs -o cjs/${packageName}.js`);
2525

26-
console.log("\nBuilding UMD modules...")
26+
console.log("\nBuilding UMD modules...");
2727

28-
const varName = pascalCase(packageName)
28+
const varName = pascalCase(packageName);
2929

30-
exec(`rollup -c scripts/config.js -f umd -n ${varName} -o umd/${packageName}.js`, {
31-
BUILD_ENV: "development"
32-
})
30+
exec(
31+
`rollup -c scripts/config.js -f umd -n ${varName} -o umd/${packageName}.js`,
32+
{
33+
BUILD_ENV: "development"
34+
}
35+
);
3336

34-
exec(`rollup -c scripts/config.js -f umd -n ${varName} -o umd/${packageName}.min.js`, {
35-
BUILD_ENV: "production"
36-
})
37+
exec(
38+
`rollup -c scripts/config.js -f umd -n ${varName} -o umd/${packageName}.min.js`,
39+
{
40+
BUILD_ENV: "production"
41+
}
42+
);
3743

3844
console.log(
3945
"\nThe minified, gzipped UMD build is %s",
4046
prettyBytes(gzipSize.sync(fs.readFileSync(`umd/${packageName}.min.js`)))
41-
)
47+
);

0 commit comments

Comments
 (0)