Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

webext-redux

Package Overview
Dependencies
Maintainers
1
Versions
17
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

webext-redux - npm Package Compare versions

Comparing version 2.0.1 to 2.0.2

2

lib/util.js

@@ -14,3 +14,3 @@ "use strict";

function getBrowserAPI() {
var api = global.chrome || global.browser;
var api = global.chrome || global.browser || browser;

@@ -17,0 +17,0 @@ if (!api) {

{
"name": "webext-redux",
"version": "2.0.1",
"version": "2.0.2",
"description": "A set of utilities for building Redux applications in Web Extensions.",

@@ -5,0 +5,0 @@ "main": "lib/index.js",

@@ -18,3 +18,3 @@ # WebExt Redux

`webext-redux` allows you to build your Chrome extension like a Redux-powered webapp. The background page holds the Redux store, while Popovers and Content-Scripts act as UI Components, passing actions and state updates between themselves and the background store. At the end of the day, you have a single source of truth (your Redux store) that describes the entire state of your extension.
`webext-redux` allows you to build your Web Extension like a Redux-powered webapp. The background page holds the Redux store, while Popovers and Content-Scripts act as UI Components, passing actions and state updates between themselves and the background store. At the end of the day, you have a single source of truth (your Redux store) that describes the entire state of your extension.

@@ -123,3 +123,3 @@ All UI Components follow the same basic flow:

// this call can only be made in the background script
chrome.notifications.create(...);
browser.notifications.create(...);

@@ -198,3 +198,3 @@ };

You may wish to implement custom serialization and deserialization logic for communication between the background store and your proxy store(s). Chrome's message passing (which is used to implement this library) automatically serializes messages when they are sent and deserializes them when they are received. In the case that you have non-JSON-ifiable information in your Redux state, like a circular reference or a `Date` object, you will lose information between the background store and the proxy store(s). To manage this, both `wrapStore` and `Store` accept `serializer` and `deserializer` options. These should be functions that take a single parameter, the payload of a message, and return a serialized and deserialized form, respectively. The `serializer` function will be called every time a message is sent, and the `deserializer` function will be called every time a message is received. Note that, in addition to state updates, action creators being passed from your content script(s) to your background page will be serialized and deserialized as well.
You may wish to implement custom serialization and deserialization logic for communication between the background store and your proxy store(s). Web Extension's message passing (which is used to implement this library) automatically serializes messages when they are sent and deserializes them when they are received. In the case that you have non-JSON-ifiable information in your Redux state, like a circular reference or a `Date` object, you will lose information between the background store and the proxy store(s). To manage this, both `wrapStore` and `Store` accept `serializer` and `deserializer` options. These should be functions that take a single parameter, the payload of a message, and return a serialized and deserialized form, respectively. The `serializer` function will be called every time a message is sent, and the `deserializer` function will be called every time a message is received. Note that, in addition to state updates, action creators being passed from your content script(s) to your background page will be serialized and deserialized as well.

@@ -208,3 +208,3 @@ ### Example

id: 1,
text: 'Write a Chrome extension',
text: 'Write a Web extension',
created: new Date(2018, 0, 1)

@@ -221,3 +221,3 @@ }

id: 1,
text: 'Write a Chrome extension',
text: 'Write a Web extension',
created: {}

@@ -228,3 +228,3 @@ }

As you can see, Chrome's message passing has caused your date to disappear. You can pass a custom `serializer` and `deserializer` to both `wrapStore` and `Store` to make sure your dates get preserved:
As you can see, Web Extension's message passing has caused your date to disappear. You can pass a custom `serializer` and `deserializer` to both `wrapStore` and `Store` to make sure your dates get preserved:

@@ -270,6 +270,6 @@ ```js

const stringified = JSON.stringify(state, dateReplacer)
//"{"todos":[{"id":1,"text":"Write a Chrome extension","created":{"_RECOVER_DATE":1514793600000}}]}"
//"{"todos":[{"id":1,"text":"Write a Web extension","created":{"_RECOVER_DATE":1514793600000}}]}"
JSON.parse(stringified, dateReviver)
// {todos: [{ id: 1, text: 'Write a Chrome extension', created: new Date(2018, 0, 1) }]}
// {todos: [{ id: 1, text: 'Write a Web extension', created: new Date(2018, 0, 1) }]}
```

@@ -305,3 +305,3 @@

import {wrapStore} from 'webext-redux';
import deepDiff from 'webext-redux/strategies/deepDiff/diff';
import deepDiff from 'webext-redux/lib/strategies/deepDiff/diff';

@@ -319,3 +319,3 @@ const store; // a normal Redux store

import {Store} from 'webext-redux';
import patchDeepDiff from 'webext-redux/strategies/deepDiff/patch';
import patchDeepDiff from 'webext-redux/lib/strategies/deepDiff/patch';

@@ -337,3 +337,3 @@ const store = new Store({

import {wrapStore} from 'webext-redux';
import makeDiff from 'webext-redux/strategies/deepDiff/makeDiff';
import makeDiff from 'webext-redux/lib/strategies/deepDiff/makeDiff';

@@ -340,0 +340,0 @@ const store; // a normal Redux store

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc