5 Commits
3.2.5 ... 4.2.0

Author SHA1 Message Date
2b1e7d6816 Added coverage 2022-09-23 11:40:46 -04:00
e14e1ffa74 Added build pipeline 2022-09-23 11:38:55 -04:00
414128db90 Bump to 4.1.0, removed lib 2021-05-15 20:18:48 -04:00
132f23a028 Removed crypto-js 2021-05-15 19:57:12 -04:00
f27014af14 Updated docs 2021-02-02 00:05:08 -05:00
12 changed files with 142 additions and 179 deletions

2
.gitignore vendored
View File

@ -2,7 +2,7 @@
# compiled output
/tmp
/out-tsc
/lib
# dependencies
/node_modules

129
.gitlab/.gitlab-ci.yml Normal file
View File

@ -0,0 +1,129 @@
image: node:16
npm:
stage: build
artifacts:
paths:
- dist
expire_in: 1 week
cache:
- key:
files:
- package.json
paths:
- node_modules
- package-lock.json
policy: pull-push
- key: $CI_PIPELINE_ID
paths:
- dist
policy: push
script:
- npm i
- npm run build
rules:
- if: $CI_COMMIT_BRANCH
audit:
stage: test
cache:
- key:
files:
- package.json
paths:
- node_modules
policy: pull
script:
- AUDIT=$(npm audit)
- echo "vulnerabilities_high $(echo $AUDIT | grep -oE '[0-9]+ high' | grep -oE '[0-9]+' || echo 0)" > metrics.txt
- echo "vulnerabilities_medium $(echo $AUDIT | grep -oE '[0-9]+ moderate' | grep -oE '[0-9]+' || echo 0)" >> metrics.txt
- echo "vulnerabilities_low $(echo $AUDIT | grep -oE '[0-9]+ low' | grep -oE '[0-9]+' || echo 0)" >> metrics.txt
- echo "$AUDIT"
artifacts:
reports:
metrics: metrics.txt
rules:
- if: $CI_COMMIT_BRANCH
jest:
stage: test
cache:
- key:
files:
- package.json
paths:
- node_modules
policy: pull
script:
- npm run test:coverage
coverage: /All\sfiles.*?\s+(\d+.\d+)/
artifacts:
when: always
reports:
junit: junit.xml
rules:
- if: $CI_COMMIT_BRANCH
registry-gitlab:
stage: deploy
cache:
- key:
files:
- package.json
paths:
- node_modules
policy: pull
- key: $CI_PIPELINE_ID
paths:
- dist
policy: pull
before_script:
- VERSION=$(cat package.json | grep version | grep -Eo ':.+' | grep -Eo '[[:alnum:]\.\/\-]+')
- if [ "$CI_COMMIT_BRANCH" != "$CI_DEFAULT_BRANCH" ] && [ "$VERSION" != *"-$CI_COMMIT_BRANCH" ]; then VERSION="$VERSION-$(echo "$CI_COMMIT_BRANCH" | sed -E "s/[_/]/-/g")"; npm version --no-git-tag-version $VERSION; fi
script:
- PACKAGES=$(curl -s -H "PRIVATE-TOKEN:$DEPLOY_TOKEN" "https://$CI_SERVER_HOST/api/v4/projects/$CI_PROJECT_ID/packages")
- ID=$(node -pe "JSON.parse(process.argv[1]).find(p => p['version'] == process.argv[2])?.id || ''" $PACKAGES $VERSION)
- if [ -n "$ID" ]; then curl -s -X DELETE -H "PRIVATE-TOKEN:$DEPLOY_TOKEN" https://$CI_SERVER_HOST/api/v4/projects/$CI_PROJECT_ID/packages/$ID; fi
- printf "@cwb:registry=https://$CI_SERVER_HOST/api/v4/projects/$CI_PROJECT_ID/packages/npm/\n//$CI_SERVER_HOST/api/v4/projects/$CI_PROJECT_ID/packages/npm/:_authToken=$DEPLOY_TOKEN" > .npmrc
- npm publish
rules:
- if: '$CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH'
allow_failure: true
- if: $CI_COMMIT_BRANCH
when: manual
allow_failure: true
registry-npm:
stage: deploy
cache:
- key:
files:
- package.json
paths:
- node_modules
policy: pull
- key: $CI_PIPELINE_ID
paths:
- dist
policy: pull
script:
- npm publish
rules:
- if: '$CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH'
allow_failure: true
tag:
stage: deploy
image:
name: alpine/git
entrypoint: [ "" ]
cache: [ ]
before_script:
- git remote set-url origin "https://Tagger:$DEPLOY_TOKEN@$CI_SERVER_HOST/$CI_PROJECT_PATH.git"
script:
- VERSION=$(cat package.json | grep version | grep -Eo ':.+' | grep -Eo '[[:alnum:]\.\/\-]+')
- git tag -f $VERSION $CI_COMMIT_SHA
- git push -f origin $VERSION
rules:
- if: '$CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH'
allow_failure: true

View File

@ -9,14 +9,15 @@ for persisting themes or local settings over reloads or maintaining filters/sear
import {LocalStorage, SessionStorage} from 'webstorage-decorators';
export class MyCustomClass {
@LocalStorage({key: 'site_theme', default: 'light_theme'}) theme: string;
@SessionStorage({encryptWith: config.entryptionKey}) thisUser: User;
@LocalStorage('light_theme', {key: 'site_theme'}) theme: string;
@SessionStorage(null, {encryptWith: config.entryptionKey}) thisUser: User;
@SessionStorage() searchBar: string;
constructor() {
constructor() {
console.log(this.theme, localStorage.getItem('theme')); // Output: 'light_theme', 'light_theme'
console.log(this.user, localStorage.getItem('user')); // Output: null, undefined
user = {first: 'John', last: 'Smith', ...}
console.log(this.user, this.user == localStorage.getItem('user')); // Output: {first: 'John', last: 'Smith', ...}, true
console.log(this.user, localStorage.getItem('user')); // Output: {first: 'John', last: 'Smith', ...}, **Some encrypted value**
}
}
```
@ -35,7 +36,6 @@ export class MyCustomClass {
| Options | Description |
|---------|-------------|
| default | Default value, same as decorator's first argument |
| encryptWith | Secret key to encrypt stored values with |
| key | Key to reference value inside local/session storage (Defaults to the property name) |
## Caveats

1
lib/index.d.ts vendored
View File

@ -1 +0,0 @@
export * from './webstorage';

View File

@ -1,2 +0,0 @@
export * from './webstorage';
//# sourceMappingURL=index.js.map

View File

@ -1 +0,0 @@
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

41
lib/webstorage.d.ts vendored
View File

@ -1,41 +0,0 @@
/**
* Options to be used with WebStorage decorators
*/
export interface WebStorageOptions {
/** Default value to provide if storage is empty */
default?: any;
/** Key to prevent plain text storage **/
encryptWith?: string;
/** Key to save under */
key?: string;
}
/**
* Automatically syncs localStorage with the decorated property.
*
* **Example**
* ```
* class Example {
* @LocalStorage() lastLogin: string;
* @LocalStorage(false, {key: '_hideMenu'}) hideMenu: boolean;
* }
* ```
*
* @param defaultValue Default value to return if property does no exist inside localStorage.
* @param opts Any additional options
*/
export declare function LocalStorage(defaultValue?: any, opts?: WebStorageOptions): (target: object, key: string) => void;
/**
* Automatically syncs sessionStorage with the decorated property.
*
* **Example**
* ```
* class Example {
* @SessionStorage() lastLogin: string;
* @SessionStorage(false, {key: '_hideMenu'}) hideMenu: boolean;
* }
* ```
*
* @param defaultValue Default value to return if property does no exist inside sessionStorage.
* @param opts Any additional options
*/
export declare function SessionStorage(defaultValue?: any, opts?: WebStorageOptions): (target: object, key: string) => void;

View File

@ -1,98 +0,0 @@
import * as crypto from 'crypto-js';
/**
* Automatically syncs localStorage with the decorated property.
*
* **Example**
* ```
* class Example {
* @LocalStorage() lastLogin: string;
* @LocalStorage(false, {key: '_hideMenu'}) hideMenu: boolean;
* }
* ```
*
* @param defaultValue Default value to return if property does no exist inside localStorage.
* @param opts Any additional options
*/
export function LocalStorage(defaultValue, opts = {}) {
opts.default = defaultValue;
return decoratorBuilder(localStorage, opts);
}
/**
* Automatically syncs sessionStorage with the decorated property.
*
* **Example**
* ```
* class Example {
* @SessionStorage() lastLogin: string;
* @SessionStorage(false, {key: '_hideMenu'}) hideMenu: boolean;
* }
* ```
*
* @param defaultValue Default value to return if property does no exist inside sessionStorage.
* @param opts Any additional options
*/
export function SessionStorage(defaultValue, opts = {}) {
opts.default = defaultValue;
return decoratorBuilder(sessionStorage, opts);
}
/**
* **Internal use only**
*
* Fetch variable from storage & take care of any defaults, object definitions, encryption & serialization
*
* @param storage Web Storage API
* @param opts Any additional options
*/
function fromStorage(storage, opts) {
let storedVal = storage.getItem(opts.key);
if (storedVal == null || storedVal == "" || storedVal == "undefined") {
if (opts.default == null)
return null;
if (opts.default != 'object')
return opts.default;
if (opts.default.constructor != null)
return Object.assign(new opts.default.constructor(), opts.default);
let temp = Object.assign({}, opts.default);
Object.setPrototypeOf(temp, Object.getPrototypeOf(opts.default));
return temp;
}
storedVal = JSON.parse(storedVal);
if (opts.encryptWith != null)
storedVal = JSON.parse(crypto.AES.decrypt(storedVal, opts.encryptWith).toString(crypto.enc.Utf8));
if (typeof storedVal != 'object' || !Array.isArray(storedVal))
return storedVal;
if (opts.default != null && opts.default.constructor != null)
return Object.assign(new opts.default.constructor(), opts.default, storedVal);
return Object.assign({}, opts.default, storedVal);
}
/**
* **Internal use only**
*
* Overrides the properties getter/setter methods to read/write from the provided storage endpoint.
*
* @param storage Web Storage API
* @param opts Any additional options
*/
function decoratorBuilder(storage, opts) {
return function (target, key) {
if (!opts.key)
opts.key = key;
let field = fromStorage(storage, opts);
Object.defineProperty(target, key, {
get: function () {
if (field != fromStorage(storage, { key: opts.key, encryptWith: opts.encryptWith }))
target[key] = field;
return field;
},
set: function (value) {
field = value;
if (value == null)
storage.removeItem(opts.key);
if (opts.encryptWith != null)
value = crypto.AES.encrypt(JSON.stringify(value), opts.encryptWith).toString();
storage.setItem(opts.key, JSON.stringify(value));
}
});
};
}
//# sourceMappingURL=webstorage.js.map

View File

@ -1 +0,0 @@
{"version":3,"file":"webstorage.js","sourceRoot":"","sources":["../src/webstorage.ts"],"names":[],"mappings":"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"}

View File

@ -1,6 +1,6 @@
{
"name": "webstorage-decorators",
"version": "3.2.5",
"version": "4.2.0",
"description": "Decorators to sync class properties to Local/Session storage",
"repository": "https://github.com/ztimson/WebstorageDecorators",
"main": "./lib/index.js",
@ -8,6 +8,7 @@
"scripts": {
"build": "tsc",
"test": "jest --verbose",
"test:coverage": "npx jest --verbose --coverage",
"watch": "npm run build && tsc --watch"
},
"files": [
@ -21,10 +22,7 @@
],
"author": "Zak Timson",
"license": "ISC",
"dependencies": {
"@types/crypto-js": "^4.0.1",
"crypto-js": "^4.0.0"
},
"dependencies": {},
"devDependencies": {
"@types/jest": "^26.0.15",
"jest": "^26.6.0",

View File

@ -1,13 +1,9 @@
import * as crypto from 'crypto-js';
/**
* Options to be used with WebStorage decorators
*/
export interface WebStorageOptions {
/** Default value to provide if storage is empty */
default?: any;
/** Key to prevent plain text storage **/
encryptWith?: string;
/** Key to save under */
key?: string;
}
@ -69,9 +65,9 @@ function fromStorage(storage: Storage, opts: WebStorageOptions) {
return temp;
}
storedVal = JSON.parse(<string>storedVal);
if(opts.encryptWith != null) storedVal = JSON.parse(crypto.AES.decrypt(<string>storedVal, opts.encryptWith).toString(crypto.enc.Utf8));
if(typeof storedVal != 'object' || !Array.isArray(storedVal)) return storedVal;
if(opts.default != null && opts.default.constructor != null) return Object.assign(new opts.default.constructor(), opts.default, storedVal);
if(opts.default != null && opts.default.constructor != null)
return Object.assign(new opts.default.constructor(), opts.default, storedVal);
return Object.assign({}, opts.default, storedVal);
}
@ -89,13 +85,12 @@ function decoratorBuilder(storage: Storage, opts: WebStorageOptions) {
let field = fromStorage(storage, opts);
Object.defineProperty(target, key, {
get: function() {
if(field != fromStorage(storage, {key: opts.key, encryptWith: opts.encryptWith})) target[key] = field;
if(field != fromStorage(storage, {key: opts.key})) target[key] = field;
return field;
},
set: function(value?) {
field = value;
if(value == null) storage.removeItem(<string>opts.key);
if(opts.encryptWith != null) value = <any>crypto.AES.encrypt(JSON.stringify(value), opts.encryptWith).toString();
storage.setItem(<string>opts.key, JSON.stringify(value));
}
});

View File

@ -1,7 +1,6 @@
import {LocalStorage, SessionStorage} from "../src";
const CUSTOM_KEY = '_MY_KEY'
const ENCRYPTION_KEY = 'abc123';
class TestType {
constructor(public first: string, public last: string) { }
@ -12,16 +11,14 @@ class TestStorage {
@LocalStorage() localStorage: any;
@LocalStorage({a: true, b: 'test', c: 3.14}) defaultedLocalStorage: any;
@LocalStorage(null, {key: CUSTOM_KEY}) customLocalStorage: any;
@LocalStorage(null, {encryptWith: ENCRYPTION_KEY}) encryptedLocalStorage: any;
@LocalStorage(new TestType('John', 'Smith')) objectLocalStorage!: TestType;
@SessionStorage() sessionStorage: any;
@SessionStorage({a: true, b: 'test', c: 3.14}) defaultedSessionStorage: any;
@SessionStorage(null, {key: CUSTOM_KEY}) customSessionStorage: any;
@SessionStorage(null, {encryptWith: ENCRYPTION_KEY}) encryptedSessionStorage: any;
@SessionStorage(new TestType('John', 'Smith')) objectSessionStorage!: TestType;
}
describe('Webstorage Decorators', () => {
describe('WebStorage Decorators', () => {
let testComponent: TestStorage;
beforeEach(() => {
localStorage.clear();
@ -67,12 +64,6 @@ describe('Webstorage Decorators', () => {
expect(localStorage.getItem(CUSTOM_KEY)).toBe(JSON.stringify(testValue));
expect(testComponent.customLocalStorage).toBe(testValue);
});
test('Encrypted', () => {
const testValue = Math.random();
testComponent.encryptedLocalStorage = testValue;
expect(localStorage.getItem('encryptedLocalStorage')).not.toBe(JSON.stringify(testValue));
expect(testComponent.encryptedLocalStorage).toBe(testValue);
});
test('Impure Functions', () => {
testComponent.localStorage = [1];
testComponent.localStorage.push(2);
@ -128,12 +119,6 @@ describe('Webstorage Decorators', () => {
expect(sessionStorage.getItem(CUSTOM_KEY)).toBe(JSON.stringify(testValue));
expect(testComponent.customSessionStorage).toBe(testValue);
});
test('Encrypted', () => {
const testValue = Math.random();
testComponent.encryptedSessionStorage = testValue;
expect(sessionStorage.getItem('encryptedSessionStorage')).not.toBe(JSON.stringify(testValue));
expect(testComponent.encryptedSessionStorage).toBe(testValue);
});
test('Impure Functions', () => {
testComponent.sessionStorage = [1];
testComponent.sessionStorage.push(2);