use localforage in a serviceworker #402

remkoboschker · 2015-07-15T09:06:43Z

Hi,

I would like to use localforage in a serviceworker. Version 1.2.4 in Chrome 43 throws a reference error on line 963 "window undefined", because there is no window in the serviceworker.

Window was removed in #144 but reintroduced in #237.

Should localforage or should it not be usable in a webworker / serviceworker environment?

I'll see if I can get it to work.

tofumatt · 2015-07-15T09:25:33Z

It is a design goal of localforage to work in web workers. You're right though ; it currently doesn't work.

If you can send a pull request that fixes it that would be great, but if not know it's something I'll eventually work on :-)

tofumatt

On Wed, Jul 15, 2015 at 10:06 AM, Remko Boschker [email protected]
wrote:

Hi,
I would like to use localforage in a serviceworker. Version 1.2.4 in Chrome 43 throws a reference error on line 963 "window undefined", because there is no window in the serviceworker.
Window was removed in #144 but reintroduced in #237.
Should localforage or should it not be usable in a webworker / serviceworker environment?

I'll see if I can get it to work.

Reply to this email directly or view it on GitHub:
#402

remkoboschker · 2015-07-15T09:27:55Z

replacing .call(window) by .call(this) loads the lib just fine, but this probably introduces other issues. I'll fork and run some tests later today. Thanks.

tofumatt · 2015-07-15T09:31:46Z

Awesome, thanks so much.

If you run the tests using npm test you can run them in phantomjs, and using grunt serve should allow you to run them from browsers using a local node server URL.

tofumatt

On Wed, Jul 15, 2015 at 10:27 AM, Remko Boschker [email protected]
wrote:

replacing .call(window) by .call(this) loads the lib just fine, but this probably introduces other issues. I'll fork and run some tests later today. Thanks.

Reply to this email directly or view it on GitHub:
#402 (comment)

thgreasi · 2015-07-15T11:54:49Z

.call(typeof window !== 'undefined' ? window : this)
Looks like a safe bet :-)

On Wed, Jul 15, 2015, 12:31 Matthew Riley MacPherson <
[email protected]> wrote:

Awesome, thanks so much.

If you run the tests using npm test you can run them in phantomjs, and
using grunt serve should allow you to run them from browsers using a
local node server URL.

tofumatt

On Wed, Jul 15, 2015 at 10:27 AM, Remko Boschker <[email protected]

wrote:

replacing .call(window) by .call(this) loads the lib just fine, but this
probably introduces other issues. I'll fork and run some tests later today.

Thanks.

Reply to this email directly or view it on GitHub:
#402 (comment)

—
Reply to this email directly or view it on GitHub
#402 (comment)
.

remkoboschker · 2015-07-15T11:57:47Z

😄 sure, will use it.

thgreasi · 2015-07-15T20:09:22Z

This might be useful.

thgreasi · 2015-07-17T18:39:25Z

Just took a shot on this, the web workers part, at least... Hope it will
work with service workers similarly.
Since we now deal with es6 modules, we are in "use strict" mode by default
(and babel honors this semantic). As a result this is undefined inside
IIFEs...

On Wed, Jul 15, 2015, 14:57 Remko Boschker [email protected] wrote:

[image: 😄] sure, will use it.

—
Reply to this email directly or view it on GitHub
#402 (comment)
.

remkoboschker · 2015-07-20T08:37:15Z

In the service worker your fix raises

Uncaught (in promise) TypeError: self._initStorage is not a function at http://localhost:8080/js/lib/localforage.js:265:48

.call(typeof window !== 'undefined' ? window : this) does not raise this exception

Also a unit test fails

  1) Config API Driver API "before each" hook:
     ReferenceError: Can't find variable: localforage
      at http://localhost:9999/test/test.drivers.js:11
      at http://localhost:9999/bower_components/mocha/mocha.js:4315
      at next (http://localhost:9999/bower_components/mocha/mocha.js:4626)
      at http://localhost:9999/bower_components/mocha/mocha.js:4630
      at timeslice (http://localhost:9999/bower_components/mocha/mocha.js:5761)

I'll work on a fix

thgreasi · 2015-07-20T10:30:04Z

We might just have to use a different var name for the scope. Maybe service
workers do not like redefining self.

On Mon, Jul 20, 2015, 11:37 Remko Boschker [email protected] wrote:

In the service worker your fix raises

Uncaught (in promise) TypeError: self._initStorage is not a function at http://localhost:8080/js/lib/localforage.js:265:48

Also a unit test fails

Config API Driver API "before each" hook:
ReferenceError: Can't find variable: localforage
at http://localhost:9999/test/test.drivers.js:11
at http://localhost:9999/bower_components/mocha/mocha.js:4315
at next (http://localhost:9999/bower_components/mocha/mocha.js:4626)
at http://localhost:9999/bower_components/mocha/mocha.js:4630
at timeslice (http://localhost:9999/bower_components/mocha/mocha.js:5761)

I'll work on a fix

—
Reply to this email directly or view it on GitHub
#402 (comment)
.

thgreasi · 2015-07-20T10:30:34Z

Can you share your service worker test code?

On Mon, Jul 20, 2015, 13:29 Thodoris Greasidis [email protected] wrote:

We might just have to use a different var name for the scope. Maybe
service workers do not like redefining self.

On Mon, Jul 20, 2015, 11:37 Remko Boschker [email protected]
wrote:

In the service worker your fix raises

Uncaught (in promise) TypeError: self._initStorage is not a function at http://localhost:8080/js/lib/localforage.js:265:48

Also a unit test fails

Config API Driver API "before each" hook:
ReferenceError: Can't find variable: localforage
at http://localhost:9999/test/test.drivers.js:11
at http://localhost:9999/bower_components/mocha/mocha.js:4315
at next (http://localhost:9999/bower_components/mocha/mocha.js:4626)
at http://localhost:9999/bower_components/mocha/mocha.js:4630
at timeslice (http://localhost:9999/bower_components/mocha/mocha.js:5761)

I'll work on a fix

—
Reply to this email directly or view it on GitHub
#402 (comment)
.

remkoboschker · 2015-07-21T14:25:49Z

Hi,

I mistakenly took the src instead of the build with the drivers in the file. Sorry for that.

I noticed that window has a property self that returns itself. Perhaps just replacing this with self will do. I'll add a unit test for service-workers tomorrow.

thgreasi · 2015-07-21T15:35:28Z

Yes, I had that in mind, but wanted to avoid possible problems with the
different module bundlers/loaders.
self is one of the most common variable names (along with that) used
for sharing context with closures (it's used by localforage as well, as you
noticed). As a result, there are cases that people overwrite it without
even knowing its existence.
Anyway if have anything against my approach, I would be happy to change
that with a new commit.

On Tue, Jul 21, 2015, 17:25 Remko Boschker [email protected] wrote:

Hi,

I mistakenly took the src instead of the build with the drivers in the
file. Sorry for that.

I noticed that window has a property self that returns itself. Perhaps
just replacing this with self will do. I'll add a unit test for
service-workers tomorrow.

—
Reply to this email directly or view it on GitHub
#402 (comment)
.

thgreasi · 2015-07-21T18:42:34Z

Let me rephrase that, since I think I might missed my point/wasn't clear:

For most devs/libs, window is the global object in JS. So for everyday webdev window is respencted and not redeclared. Some of them ignore the existence of self and even more redeclare it to pass contexts around.
For *worker devs/libs, self is the global object by default. We can bet that they use it carefully, since otherwise bugs should have appear.

Still, I have no problem using just self if you think that all the above is just an overkill.

remkoboschker · 2015-07-23T10:12:33Z

@thgreasi I do not mind the extra precaution. Can you confirm that the test are passing in your localforage#webworkers-fix? I tried to copy the webworkers test to a serviceworker scenario but the tests are not passing. When I include only the test.webworker.js in the test.component.html not a single test is run.

tofumatt · 2015-07-23T10:43:21Z

I believe the webworker tests are commented out right now, or more accurately are marked as skip. You might need to change them to fix this.

Let me know if it seems like that's the case but you need more help.

—
Sent from Mailbox

On Thu, Jul 23, 2015 at 10:12 AM, Remko Boschker [email protected]
wrote:

@thgreasi I do not mind the extra precaution. Can you confirm that the test are passing in your localforage#webworkers-fix? I tried to copy the webworkers test to a serviceworker scenario but the tests are not passing. When I include only the test.webworker.js in the test.component.html not a single test is run.

Reply to this email directly or view it on GitHub:
#402 (comment)

thgreasi · 2015-07-23T10:53:11Z

@tofumatt, @remkoboschker
I removed the skip in PR #406 and seems to work with changes I did to call(...) and the babel system import plugin.
I can verify that #406 fixes web-workers and passes the test cases both on Travis and locally/in-browser.

@remkoboschker I also started looking at a service worker test case (today morning), but it is still in embryonic state I think.

remkoboschker · 2015-07-23T11:57:12Z

@thgreasi I have a basic unit test
serviceworker-client.js:

importScripts("/dist/localforage.js");

self.oninstall = function(event) {
   event.waitUntil(
       localforage
       .setItem('serviceworker', 'serviceworker present')
       .then(function(value) {
           console.log(value);
       })
   );
};

test.serviceworker.js:

describe('serviceworkers', function() {
    it('should set a value', function(done) {
       navigator
       .serviceWorker
       .register('/test/serviceworker-client.js')
       .then(function() {
           return localforage.getItem('serviceworker');
       })
       .then(function(result) {
           expect(result).to.equal('serviceworker present');
           done();
       })
       .catch(function(error) {
           done(error);
       });
   });
});

It runs in a browser, but not in Phantomjs; don't know why

thgreasi · 2015-07-23T13:56:29Z

That looks very similar to my code! On top of that, I'm currently trying to
post the desired driver name to the service worker.

On Thu, Jul 23, 2015, 14:57 Remko Boschker [email protected] wrote:

@thgreasi https://github.com/thgreasi I have a basic unit test
serviceworker-client.js:

importScripts("/dist/localforage.js");

self.oninstall = function(event) {
event.waitUntil(
localforage
.setItem('serviceworker', 'serviceworker present')
.then(function(value) {
console.log(value);
})
);
};

test.serviceworker.js:

describe('serviceworkers', function() {
it('should set a value', function(done) {
navigator
.serviceWorker
.register('/test/serviceworker-client.js')
.then(function() {
return localforage.getItem('serviceworker');
})
.then(function(result) {
expect(result).to.equal('serviceworker present');
done();
})
.catch(function(error) {
done(error);
});
});
});

—
Reply to this email directly or view it on GitHub
#402 (comment)
.

thgreasi · 2015-07-23T14:02:09Z

Can I find this code in any public commit that I can cherry pick and push
on top of my PR? (And also possibly cherry pick it retaining your commit
info.)

On Thu, Jul 23, 2015, 16:55 Thodoris Greasidis [email protected] wrote:

That looks very similar to my code! On top of that, I'm currently trying
to post the desired driver name to the service worker.

On Thu, Jul 23, 2015, 14:57 Remko Boschker [email protected]
wrote:

@thgreasi https://github.com/thgreasi I have a basic unit test
serviceworker-client.js:

importScripts("/dist/localforage.js");

self.oninstall = function(event) {
event.waitUntil(
localforage
.setItem('serviceworker', 'serviceworker present')
.then(function(value) {
console.log(value);
})
);
};

test.serviceworker.js:

describe('serviceworkers', function() {
it('should set a value', function(done) {
navigator
.serviceWorker
.register('/test/serviceworker-client.js')
.then(function() {
return localforage.getItem('serviceworker');
})
.then(function(result) {
expect(result).to.equal('serviceworker present');
done();
})
.catch(function(error) {
done(error);
});
});
});

—
Reply to this email directly or view it on GitHub
#402 (comment)
.

remkoboschker · 2015-07-23T14:49:04Z

I have pushed the branch to https://github.com/curit/localForage. In test/test.serviceworker.js en in test/serviceworker-client.js an earlier attempt to send messages is commented out. I found this example to be quite useful https://jakearchibald.github.io/isserviceworkerready/demos/postMessage/

Good luck!

thgreasi · 2015-07-23T15:31:37Z

Is there any chance you can rebase over the latest commit of my PR (and
even better squash some commits)? I'm getting a huge diff on the dist
files even though I was just expecting the extra test case.
On the other hand I don't want to spam you, the service worker test case
could also be a separate PR :)

On Thu, Jul 23, 2015, 17:49 Remko Boschker [email protected] wrote:

I have pushed the branch to https://github.com/curit/localForage. In
test/test.serviceworker.js en in test/serviceworker-client.js an earlier
attempt to send messages is commented out. I found this example to be quite
useful
https://jakearchibald.github.io/isserviceworkerready/demos/postMessage/

Good luck!

—
Reply to this email directly or view it on GitHub
#402 (comment)
.

remkoboschker · 2015-07-24T07:52:43Z

@thgreasi sorry about the diff I was trying to get the unit test to run at all. I'm working on it. By the way how do I get at the pull request in git or should I fork your repo?

remkoboschker · 2015-07-24T08:42:13Z

Turns out the component-build was not being executed. So now I can run the tests and have submitted a pull request to your repo. I will now try to get the tests to pass.

I found this useful to fetch the pull request https://help.github.com/articles/checking-out-pull-requests-locally/

remkoboschker · 2015-07-24T10:51:41Z

thgreasi#1 now has both tests passing when run in Chrome 44

remkoboschker · 2015-07-24T11:55:46Z

and in firefox nightly with the dom.serviceworker enabled

remkoboschker · 2015-07-24T12:39:57Z

It does not look like phantomjs supports serviceworkers. I have asked some questions jakearchibald/isserviceworkerready#43 and ariya/phantomjs#13437

thgreasi · 2015-07-24T12:48:33Z

Just 1 thing to note: awesome 👍

remkoboschker · 2015-07-24T12:56:53Z

@thgreasi Thank you. I'm away on holiday the coming weeks. So good luck with the pull request!

thgreasi · 2015-07-24T15:43:18Z

@remkoboschker best wishes regarding your holidays. I will try to finish this up by the time you are back.
Thanks for your collaboration.

thgreasi · 2015-07-24T18:39:46Z

@remkoboschker Awesome work!!! I'm speechless 😮 😮 😮 😃
I will try to merge it today or at most tomorrow.

thgreasi mentioned this issue Jul 18, 2015

fix(localForage): support running inside web workers #406

Closed

tofumatt closed this as completed in 9d2b28b Aug 1, 2015

frederikbosch mentioned this issue Dec 12, 2015

Discussion about implementation genkgo/ember-localforage-adapter#43

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

use localforage in a serviceworker #402

use localforage in a serviceworker #402

remkoboschker commented Jul 15, 2015

tofumatt commented Jul 15, 2015

I'll see if I can get it to work.

remkoboschker commented Jul 15, 2015

tofumatt commented Jul 15, 2015

replacing .call(window) by .call(this) loads the lib just fine, but this probably introduces other issues. I'll fork and run some tests later today. Thanks.

thgreasi commented Jul 15, 2015

Thanks.

remkoboschker commented Jul 15, 2015

thgreasi commented Jul 15, 2015

thgreasi commented Jul 17, 2015

remkoboschker commented Jul 20, 2015

thgreasi commented Jul 20, 2015

thgreasi commented Jul 20, 2015

remkoboschker commented Jul 21, 2015

thgreasi commented Jul 21, 2015

thgreasi commented Jul 21, 2015

remkoboschker commented Jul 23, 2015

tofumatt commented Jul 23, 2015

thgreasi commented Jul 23, 2015

remkoboschker commented Jul 23, 2015

thgreasi commented Jul 23, 2015

thgreasi commented Jul 23, 2015

remkoboschker commented Jul 23, 2015

thgreasi commented Jul 23, 2015

remkoboschker commented Jul 24, 2015

remkoboschker commented Jul 24, 2015

remkoboschker commented Jul 24, 2015

remkoboschker commented Jul 24, 2015

remkoboschker commented Jul 24, 2015

thgreasi commented Jul 24, 2015

remkoboschker commented Jul 24, 2015

thgreasi commented Jul 24, 2015

thgreasi commented Jul 24, 2015

use localforage in a serviceworker #402

use localforage in a serviceworker #402

Comments

remkoboschker commented Jul 15, 2015

tofumatt commented Jul 15, 2015

I'll see if I can get it to work.

remkoboschker commented Jul 15, 2015

tofumatt commented Jul 15, 2015

replacing .call(window) by .call(this) loads the lib just fine, but this probably introduces other issues. I'll fork and run some tests later today. Thanks.

thgreasi commented Jul 15, 2015

Thanks.

remkoboschker commented Jul 15, 2015

thgreasi commented Jul 15, 2015

thgreasi commented Jul 17, 2015

remkoboschker commented Jul 20, 2015

thgreasi commented Jul 20, 2015

thgreasi commented Jul 20, 2015

remkoboschker commented Jul 21, 2015

thgreasi commented Jul 21, 2015

thgreasi commented Jul 21, 2015

remkoboschker commented Jul 23, 2015

tofumatt commented Jul 23, 2015

thgreasi commented Jul 23, 2015

remkoboschker commented Jul 23, 2015

thgreasi commented Jul 23, 2015

thgreasi commented Jul 23, 2015

remkoboschker commented Jul 23, 2015

thgreasi commented Jul 23, 2015

remkoboschker commented Jul 24, 2015

remkoboschker commented Jul 24, 2015

remkoboschker commented Jul 24, 2015

remkoboschker commented Jul 24, 2015

remkoboschker commented Jul 24, 2015

thgreasi commented Jul 24, 2015

remkoboschker commented Jul 24, 2015

thgreasi commented Jul 24, 2015

thgreasi commented Jul 24, 2015