Skip to content

Commit e788bf7

Browse files
committed
Add support for custom Worker instances. Remove deprecated property.
1 parent 8ce8420 commit e788bf7

File tree

3 files changed

+26
-5
lines changed

3 files changed

+26
-5
lines changed

README.md

+1
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,7 @@ const MyComponent = () => (
8181

8282
- `url` {string} (required) Public url to the Web Worker file (or path relative to the root of your domain)
8383
- `options` {Object} Options passed to the Worker constructor
84+
- `worker` {Worker} An existing Worker instance to use instead of creating a new one (ignoring `url` and `options`)
8485
- `parser` {Function} Transforms incoming message data (not errors)
8586
- `serializer` {Function} Transforms `postMessage` payload before sending
8687
- `onMessage` {Function} Callback function invoked when a message is received, passing message data as argument

src/index.js

+3-5
Original file line numberDiff line numberDiff line change
@@ -44,10 +44,8 @@ class WebWorker extends React.Component {
4444
}
4545

4646
componentDidMount() {
47-
if (this.props.path && console) {
48-
console.warn("`path` is deprecated and will be removed in the next major release. Use `url` instead.")
49-
}
50-
this.worker = new window.Worker(this.props.url || this.props.path, this.props.options)
47+
const { url, options, worker } = this.props
48+
this.worker = worker || new window.Worker(url, options)
5149
this.worker.onmessage = this.onMessage
5250
this.worker.onerror = this.onError
5351
this.mounted = true
@@ -56,7 +54,7 @@ class WebWorker extends React.Component {
5654

5755
componentWillUnmount() {
5856
this.mounted = false
59-
this.worker.terminate()
57+
this.props.worker || this.worker.terminate()
6058
}
6159

6260
render() {

src/spec.js

+22
Original file line numberDiff line numberDiff line change
@@ -121,6 +121,28 @@ test("parser will deserialize messages received from the worker", async () => {
121121
await waitForElement(() => getByText("bar"))
122122
})
123123

124+
test("supports passing a custom Worker instance", () => {
125+
const onMessage = jest.fn()
126+
const customWorker = { postMessage: jest.fn() }
127+
const { getByText } = render(
128+
<WebWorker worker={customWorker} onMessage={onMessage}>
129+
{({ postMessage }) => <button onClick={() => postMessage("hello")}>go</button>}
130+
</WebWorker>
131+
)
132+
customWorker.onmessage({ data: "foo" })
133+
expect(onMessage).toHaveBeenCalledWith("foo")
134+
expect(customWorker.postMessage).not.toHaveBeenCalled()
135+
fireEvent.click(getByText("go"))
136+
expect(customWorker.postMessage).toHaveBeenCalledWith("hello")
137+
})
138+
139+
test("custom workers don't terminate on unmount", async () => {
140+
const customWorker = { terminate: jest.fn() }
141+
const { unmount } = render(<WebWorker worker={customWorker} />)
142+
unmount()
143+
expect(customWorker.terminate).not.toHaveBeenCalled()
144+
})
145+
124146
test("WebWorker.Data renders with last message data only when a message has been received", async () => {
125147
const { getByText, queryByText } = render(
126148
<WebWorker>

0 commit comments

Comments
 (0)