How to use persisted method in storybook-root
Best JavaScript code snippet using storybook-root
persisted_state_provider.js
Source:persisted_state_provider.js 
1import _ from 'lodash';2import sinon from 'sinon';3import noDigestPromises from 'test_utils/no_digest_promises';4import ngMock from 'ng_mock';5import expect from 'expect.js';6import { PersistedStateError } from 'ui/errors';7import 'ui/persisted_state';8let PersistedState;9describe('Persisted State Provider', function () {10 noDigestPromises.activateForSuite();11 beforeEach(function () {12 ngMock.module('kibana');13 ngMock.inject(function ($injector) {14 PersistedState = $injector.get('PersistedState');15 });16 });17 describe('state creation', function () {18 let persistedState;19 it('should create an empty state instance', function () {20 persistedState = new PersistedState();21 expect(persistedState.get()).to.eql({});22 });23 it('should create a state instance with data', function () {24 const val = { red: 'blue' };25 persistedState = new PersistedState(val);26 expect(persistedState.get()).to.eql(val);27 // ensure we get a copy of the state, not the actual state object28 expect(persistedState.get()).to.not.equal(val);29 });30 it('should create a copy of the state passed in', function () {31 const val = { red: 'blue' };32 persistedState = new PersistedState(val);33 expect(persistedState.get()).to.eql(val);34 expect(persistedState.get()).to.not.equal(val);35 });36 it('should not throw if creating valid child object', function () {37 const run = function () {38 const val = { red: 'blue' };39 const path = ['test.path'];40 const parent = new PersistedState();41 new PersistedState(val, path, parent);42 };43 expect(run).not.to.throwException();44 });45 it('should throw if given an invalid value', function () {46 const run = function () {47 const val = 'bananas';48 new PersistedState(val);49 };50 expect(run).to.throwException(function (err) {51 expect(err).to.be.a(PersistedStateError);52 });53 });54 it('should not throw if given primitive to child', function () {55 const run = function () {56 const val = 'bananas';57 const path = ['test.path'];58 const parent = new PersistedState();59 new PersistedState(val, path, parent);60 };61 expect(run).not.to.throwException();62 });63 it('should throw if given an invalid parent object', function () {64 const run = function () {65 const val = { red: 'blue' };66 const path = ['test.path'];67 const parent = {};68 new PersistedState(val, path, parent);69 };70 expect(run).to.throwException(function (err) {71 expect(err).to.be.a(PersistedStateError);72 });73 });74 it('should throw if given a parent without a path', function () {75 const run = function () {76 const val = { red: 'blue' };77 let path;78 const parent = new PersistedState();79 new PersistedState(val, path, parent);80 };81 expect(run).to.throwException(function (err) {82 expect(err).to.be.a(PersistedStateError);83 });84 });85 });86 describe('child state creation', function () {87 let childState;88 it('should not append the child state to the parent, without parent value', function () {89 const childIndex = 'i can haz child';90 const persistedState = new PersistedState();91 childState = persistedState.createChild(childIndex);92 // parent state should not contain the child state93 expect(persistedState.get()).to.not.have.property(childIndex);94 expect(persistedState.get()).to.eql({});95 });96 it('should not append the child state to the parent, with parent value', function () {97 const childIndex = 'i can haz child';98 const persistedStateValue = { original: true };99 const persistedState = new PersistedState(persistedStateValue);100 childState = persistedState.createChild(childIndex);101 // child state should be empty, we didn't give it any default data102 expect(childState.get()).to.be(undefined);103 // parent state should not contain the child state104 expect(persistedState.get()).to.not.have.property(childIndex);105 expect(persistedState.get()).to.eql(persistedStateValue);106 });107 it('should append the child state to the parent, with parent and child values', function () {108 const childIndex = 'i can haz child';109 const childStateValue = { tacos: 'yes please' };110 const persistedStateValue = { original: true };111 const persistedState = new PersistedState(persistedStateValue);112 childState = persistedState.createChild(childIndex, childStateValue);113 // parent state should contain the child and its original state value114 const parentState = persistedState.get();115 expect(parentState).to.have.property('original', true);116 expect(parentState).to.have.property(childIndex);117 expect(parentState[childIndex]).to.eql(childStateValue);118 });119 });120 describe('deep child state creation', function () {121 it('should delegate get/set calls to parent state', function () {122 const children = [{123 path: 'first*child',124 value: { first: true, second: false }125 }, {126 path: 'second child',127 value: { first: false, second: true }128 }];129 const persistedStateValue = { original: true };130 const persistedState = new PersistedState(persistedStateValue);131 // first child is a child of the parent persistedState132 children[0].instance = persistedState.createChild(children[0].path, children[0].value);133 // second child is a child of the first child134 children[1].instance = children[0].instance.createChild(children[1].path, children[1].value);135 // second child getter should only return second child value136 expect(children[1].instance.get()).to.eql(children[1].value);137 // parent should contain original props and first child path, but not the second child path138 const parentState = persistedState.get();139 _.keys(persistedStateValue).forEach(function (key) {140 expect(parentState).to.have.property(key);141 });142 expect(parentState).to.have.property(children[0].path);143 expect(parentState).to.not.have.property(children[1].path);144 // second child path should be inside the first child145 const firstChildState = children[0].instance.get();146 expect(firstChildState).to.have.property(children[1].path);147 expect(firstChildState[children[1].path]).to.eql(children[1].value);148 // check that the second child is still accessible from the parent instance149 const firstChild = persistedState.get(children[0].path);150 expect(firstChild).to.have.property(children[1].path);151 });152 });153 describe('child state removal', function () {154 it('should clear path from parent state', function () {155 const persistedState = new PersistedState();156 persistedState.createChild('child', { userId: 1234 });157 expect(persistedState.get()).to.eql({ child: { userId: 1234 } });158 persistedState.removeChild('child');159 expect(persistedState.get()).to.eql({});160 });161 it('should reset original parent value at path', function () {162 const persistedState = new PersistedState({ user: 1234 });163 persistedState.createChild('user', { id: 5678 });164 expect(persistedState.get()).to.eql({ user: { id: 5678 } });165 persistedState.removeChild('user');166 expect(persistedState.get()).to.eql({ user: 1234 });167 });168 it('should clear changedState', function () {169 const persistedState = new PersistedState({ user: 1234 });170 const childState = persistedState.createChild('user');171 childState.set('name', 'user name');172 expect(persistedState.getChanges()).to.eql({ user: { name: 'user name' } });173 persistedState.removeChild('user');174 expect(persistedState.getChanges()).to.eql({});175 });176 });177 describe('deep child state removal', function () {178 it('should clear path from parent state', function () {179 const persistedState = new PersistedState();180 persistedState.createChild('child.state', { userId: 1234 });181 expect(persistedState.get()).to.eql({ child: { state: { userId: 1234 } } });182 persistedState.removeChild('child.state');183 expect(persistedState.get()).to.eql({});184 });185 it('should reset original parent value at path', function () {186 const persistedState = new PersistedState({ user: { id: 1234 } });187 persistedState.createChild('user.id', 5678);188 expect(persistedState.get()).to.eql({ user: { id: 5678 } });189 persistedState.removeChild('user.id');190 expect(persistedState.get()).to.eql({ user: { id: 1234 } });191 });192 it('should reset original parent other values at path', function () {193 const persistedState = new PersistedState({ user: { name: 'user' } });194 persistedState.createChild('user.id', 5678);195 expect(persistedState.get()).to.eql({ user: { name: 'user', id: 5678 } });196 persistedState.removeChild('user.id');197 expect(persistedState.get()).to.eql({ user: { name: 'user' } });198 });199 it('should clear the changed state', function () {200 const persistedState = new PersistedState({ user: { id: 1234 } });201 const childState = persistedState.createChild('user.name');202 childState.set('user name');203 expect(persistedState.getChanges()).to.eql({ user: { name: 'user name' } });204 persistedState.removeChild('user.name');205 expect(persistedState.getChanges()).to.eql({});206 });207 });208 describe('child state conditions', function () {209 it('should be merged with the parent state', function () {210 const parent = new PersistedState({ name: 'test' });211 parent.createChild('child', 'value');212 expect(parent.get()).to.eql({213 name: 'test',214 child: 'value'215 });216 parent.set('id', 1234);217 expect(parent.get()).to.eql({218 id: 1234,219 name: 'test',220 child: 'value'221 });222 parent.set({});223 expect(parent.get()).to.eql({224 child: 'value'225 });226 });227 it('should give child state precedence', function () {228 const parent = new PersistedState({ user: { id: 1234, name: 'test' } });229 parent.createChild('user', { name: 'child test' });230 expect(parent.get()).to.eql({231 user: {232 id: 1234,233 name: 'child test'234 }235 });236 parent.set({});237 expect(parent.get()).to.eql({ user: { name: 'child test' } });238 });239 it('should be cleaned up with removeChild', function () {240 const parent = new PersistedState({ name: 'test' });241 parent.createChild('child', 'value');242 expect(parent.get()).to.eql({243 name: 'test',244 child: 'value'245 });246 parent.removeChild('child');247 expect(parent.get()).to.eql({248 name: 'test'249 });250 });251 });252 describe('colliding child paths and parent state values', function () {253 it('should not change the child path value by default', function () {254 const childIndex = 'childTest';255 const persistedStateValue = {};256 persistedStateValue[childIndex] = { overlapping_index: true };257 const persistedState = new PersistedState(persistedStateValue);258 let state = persistedState.get();259 expect(state).to.have.property(childIndex);260 expect(state[childIndex]).to.eql(persistedStateValue[childIndex]);261 const childState = persistedState.createChild(childIndex);262 expect(childState.get()).to.eql(persistedStateValue[childIndex]);263 // make sure the parent state is still the same264 state = persistedState.get();265 expect(state).to.have.property(childIndex);266 expect(state[childIndex]).to.eql(persistedStateValue[childIndex]);267 });268 it('should merge default child state', function () {269 const childIndex = 'childTest';270 const childStateValue = { child_index: false };271 const persistedStateValue = {};272 persistedStateValue[childIndex] = { parent_index: true };273 const persistedState = new PersistedState(persistedStateValue);274 let state = persistedState.get();275 expect(state).to.have.property(childIndex);276 expect(state[childIndex]).to.eql(persistedStateValue[childIndex]);277 // pass in child state value278 const childState = persistedState.createChild(childIndex, childStateValue);279 // parent's default state is merged with child state280 const compare = _.merge({}, childStateValue, persistedStateValue[childIndex]);281 expect(childState.get()).to.eql(compare);282 state = persistedState.get();283 expect(state).to.have.property(childIndex);284 expect(state[childIndex]).to.eql(compare);285 });286 });287 describe('mutation', function () {288 it('should not mutate the internal object', function () {289 const persistedStateValue = { hello: 'world' };290 const insertedObj = { farewell: 'cruel world' };291 const persistedState = new PersistedState(persistedStateValue);292 const obj = persistedState.get();293 _.assign(obj, insertedObj);294 expect(obj).to.have.property('farewell');295 expect(persistedState.get()).to.not.have.property('farewell');296 });297 });298 describe('JSON importing and exporting', function () {299 let persistedStateValue;300 beforeEach(function () {301 persistedStateValue = { one: 1, two: 2, 'meaning of life': 42 };302 });303 describe('exporting state to JSON', function () {304 it('should return the full JSON representation', function () {305 const persistedState = new PersistedState(persistedStateValue);306 const json = persistedState.toJSON();307 expect(json).to.eql(persistedStateValue);308 });309 it('should return the JSON representation of the child state', function () {310 const persistedState = new PersistedState(persistedStateValue);311 const childState = persistedState.createChild('awesome', { pants: false });312 expect(childState.toJSON()).to.eql({ pants: false });313 // verify JSON output of the parent state314 const parentCompare = _.assign({ awesome: { pants: false } }, persistedStateValue);315 expect(persistedState.toJSON()).to.eql(parentCompare);316 });317 it('should export stringified version of state', function () {318 const persistedState = new PersistedState(persistedStateValue);319 const childState = persistedState.createChild('awesome', { pants: false });320 const data = childState.toString();321 expect(JSON.parse(data)).to.eql({ pants: false });322 // verify JSON output of the parent state323 const parentCompare = _.assign({ awesome: { pants: false } }, persistedStateValue);324 expect(JSON.parse(persistedState.toString())).to.eql(parentCompare);325 });326 });327 describe('importing state from JSON string (hydration)', function () {328 it('should set the state from JSON string input', function () {329 const stateJSON = JSON.stringify(persistedStateValue);330 const persistedState = new PersistedState();331 expect(persistedState.get()).to.eql({});332 persistedState.fromString(stateJSON);333 expect(persistedState.get()).to.eql(persistedStateValue);334 });335 });336 });337 describe('get state', function () {338 it('should perform deep gets with various formats', function () {339 const obj = {340 red: {341 green: {342 blue: 'yellow'343 }344 },345 orange: [1, 2, false, 4],346 purple: {347 violet: ''348 }349 };350 const persistedState = new PersistedState(obj);351 expect(persistedState.get()).to.eql(obj);352 expect(persistedState.get('red')).to.eql({ green: { blue: 'yellow' } });353 expect(persistedState.get('red.green')).to.eql({ blue: 'yellow' });354 expect(persistedState.get('red[green]')).to.eql({ blue: 'yellow' });355 expect(persistedState.get(['red', 'green'])).to.eql({ blue: 'yellow' });356 expect(persistedState.get('red.green.blue')).to.eql('yellow');357 expect(persistedState.get('red[green].blue')).to.eql('yellow');358 expect(persistedState.get('red.green[blue]')).to.eql('yellow');359 expect(persistedState.get('red[green][blue]')).to.eql('yellow');360 expect(persistedState.get('red.green.blue')).to.eql('yellow');361 expect(persistedState.get('orange')).to.eql([1, 2, false, 4]);362 expect(persistedState.get('orange[0]')).to.equal(1);363 expect(persistedState.get('orange[2]')).to.equal(false);364 expect(persistedState.get('purple')).to.eql({ violet: '' });365 });366 it('should perform deep gets with arrays', function () {367 const persistedState = new PersistedState({ hello: { nouns: ['world', 'humans', 'everyone'] } });368 expect(persistedState.get()).to.eql({ hello: { nouns: ['world', 'humans', 'everyone'] } });369 expect(persistedState.get('hello')).to.eql({ nouns: ['world', 'humans', 'everyone'] });370 expect(persistedState.get('hello.nouns')).to.eql(['world', 'humans', 'everyone']);371 });372 it('should pass defaults to parent delegation', function () {373 const persistedState = new PersistedState({ parent: true });374 const childState = persistedState.createChild('child', { account: { name: 'first child' } });375 const defaultValue = 'i have no data';376 expect(childState.get('account.name', defaultValue)).to.eql('first child');377 expect(childState.get('account.age', defaultValue)).to.eql(defaultValue);378 });379 });380 describe('set state', function () {381 describe('path format support', function () {382 it('should create deep objects from dot notation', function () {383 const persistedState = new PersistedState();384 persistedState.set('one.two.three', 4);385 expect(persistedState.get()).to.eql({ one: { two: { three: 4 } } });386 });387 it('should create deep objects from array notation', function () {388 const persistedState = new PersistedState();389 persistedState.set('one[two][three]', 4);390 expect(persistedState.get()).to.eql({ one: { two: { three: 4 } } });391 });392 it('should create deep objects from arrays', function () {393 const persistedState = new PersistedState();394 persistedState.set(['one', 'two', 'three'], 4);395 expect(persistedState.get()).to.eql({ one: { two: { three: 4 } } });396 });397 it('should create deep objects with an existing path', function () {398 const persistedState = new PersistedState({}, 'deep.path');399 persistedState.set('green[red].blue', 4);400 expect(persistedState.get()).to.eql({ green: { red: { blue: 4 } } });401 });402 });403 describe('simple replace operations', function () {404 let persistedState;405 it('should replace value with string', function () {406 persistedState = new PersistedState({ hello: 'world' });407 expect(persistedState.get()).to.eql({ hello: 'world' });408 persistedState.set('hello', 'fare thee well');409 expect(persistedState.get()).to.eql({ hello: 'fare thee well' });410 });411 it('should replace value with array', function () {412 persistedState = new PersistedState({ hello: ['world', 'everyone'] });413 expect(persistedState.get()).to.eql({ hello: ['world', 'everyone'] });414 persistedState.set('hello', ['people']);415 expect(persistedState.get()).to.eql({ hello: ['people'] });416 });417 it('should replace value with object', function () {418 persistedState = new PersistedState({ hello: 'world' });419 expect(persistedState.get()).to.eql({ hello: 'world' });420 persistedState.set('hello', { message: 'fare thee well' });421 expect(persistedState.get()).to.eql({ hello: { message: 'fare thee well' } });422 });423 it('should replace value with object, removing old properties', function () {424 persistedState = new PersistedState({ hello: { message: 'world' } });425 expect(persistedState.get()).to.eql({ hello: { message: 'world' } });426 persistedState.set('hello', { length: 5 });427 expect(persistedState.get()).to.eql({ hello: { length: 5 } });428 });429 });430 describe('deep replace operations', function () {431 let persistedState;432 it('should append to the object', function () {433 persistedState = new PersistedState({ hello: { message: 'world' } });434 expect(persistedState.get()).to.eql({ hello: { message: 'world' } });435 persistedState.set('hello.length', 5);436 expect(persistedState.get()).to.eql({ hello: { message: 'world', length: 5 } });437 });438 it('should change the value in the array', function () {439 persistedState = new PersistedState({ hello: { nouns: ['world', 'humans', 'everyone'] } });440 persistedState.set('hello.nouns[1]', 'aliens');441 expect(persistedState.get()).to.eql({ hello: { nouns: ['world', 'aliens', 'everyone'] } });442 expect(persistedState.get('hello')).to.eql({ nouns: ['world', 'aliens', 'everyone'] });443 expect(persistedState.get('hello.nouns')).to.eql(['world', 'aliens', 'everyone']);444 });445 });446 });447 describe('internal state tracking', function () {448 it('should be an empty object', function () {449 const persistedState = new PersistedState();450 expect(persistedState._defaultState).to.eql({});451 });452 it('should store the default state value', function () {453 const val = { one: 1, two: 2 };454 const persistedState = new PersistedState(val);455 expect(persistedState._defaultState).to.eql(val);456 });457 it('should keep track of changes', function () {458 const val = { one: 1, two: 2 };459 const persistedState = new PersistedState(val);460 persistedState.set('two', 22);461 expect(persistedState._defaultState).to.eql(val);462 expect(persistedState._changedState).to.eql({ two: 22 });463 });464 });465 describe('events', function () {466 let persistedState;467 let emitter;468 const getByType = function (type, spy) {469 spy = spy || emitter;470 return spy.getCalls().filter(function (call) {471 return call.args[0] === type;472 });473 };474 const watchEmitter = function (state) {475 return sinon.spy(state, 'emit');476 };477 beforeEach(function () {478 persistedState = new PersistedState({ checker: { events: 'event tests' } });479 emitter = watchEmitter(persistedState);480 });481 it('should emit set when setting values', function () {482 expect(getByType('set')).to.have.length(0);483 persistedState.set('checker.time', 'now');484 expect(getByType('set')).to.have.length(1);485 });486 it('should not emit when setting value silently', function () {487 expect(getByType('set')).to.have.length(0);488 persistedState.setSilent('checker.time', 'now');489 expect(getByType('set')).to.have.length(0);490 });491 it('should emit change when changing values', function () {492 expect(getByType('change')).to.have.length(0);493 persistedState.set('checker.time', 'now');494 expect(getByType('change')).to.have.length(1);495 });496 it('should not emit when changing values silently', function () {497 expect(getByType('change')).to.have.length(0);498 persistedState.setSilent('checker.time', 'now');499 expect(getByType('change')).to.have.length(0);500 });501 it('should not emit change when values are identical', function () {502 expect(getByType('change')).to.have.length(0);503 // check both forms of setting the same value504 persistedState.set('checker', { events: 'event tests' });505 expect(getByType('change')).to.have.length(0);506 persistedState.set('checker.events', 'event tests');507 expect(getByType('change')).to.have.length(0);508 });509 it('should emit change when values change', function () {510 expect(getByType('change')).to.have.length(0);511 persistedState.set('checker.events', 'i changed');512 expect(getByType('change')).to.have.length(1);513 });514 it('should not emit change when createChild has no value', function () {515 expect(getByType('change')).to.have.length(0);516 persistedState.createChild('checker');517 expect(getByType('change')).to.have.length(0);518 });519 it('should not emit change when createChild is same value', function () {520 expect(getByType('change')).to.have.length(0);521 persistedState.createChild('checker', { events: 'event tests' });522 expect(getByType('change')).to.have.length(0);523 persistedState.createChild('checker.events', 'event tests');524 expect(getByType('change')).to.have.length(0);525 });526 it('should emit change when createChild changes existing value', function () {527 expect(getByType('change')).to.have.length(0);528 persistedState.createChild('checker', { events: 'changed via child' });529 expect(getByType('change')).to.have.length(1);530 });531 it('should not emit when createChild set to silent', function () {532 expect(getByType('change')).to.have.length(0);533 persistedState.createChild('checker', { events: 'changed via child' }, true);534 expect(getByType('change')).to.have.length(0);535 });536 it('should emit change when createChild adds new value', function () {537 expect(getByType('change')).to.have.length(0);538 persistedState.createChild('new.path', { another: 'thing' });539 expect(getByType('change')).to.have.length(1);540 });541 it('should emit on parent and child instances', function (done) {542 const child = persistedState.createChild('checker');543 expect(getByType('change')).to.have.length(0);544 // parent and child should emit, set up listener to test545 child.on('change', function () {546 // child fired, make sure parent fires as well547 expect(getByType('change')).to.have.length(1);548 done();549 });550 child.set('events', 'changed via child set');551 });552 });...
persisted_state_provider.test.ts
Source:persisted_state_provider.test.ts
1/*2 * SPDX-License-Identifier: Apache-2.03 *4 * The OpenSearch Contributors require contributions made to5 * this file be licensed under the Apache-2.0 license or a6 * compatible open source license.7 */8/*9 * Licensed to Elasticsearch B.V. under one or more contributor10 * license agreements. See the NOTICE file distributed with11 * this work for additional information regarding copyright12 * ownership. Elasticsearch B.V. licenses this file to you under13 * the Apache License, Version 2.0 (the "License"); you may14 * not use this file except in compliance with the License.15 * You may obtain a copy of the License at16 *17 * http://www.apache.org/licenses/LICENSE-2.018 *19 * Unless required by applicable law or agreed to in writing,20 * software distributed under the License is distributed on an21 * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY22 * KIND, either express or implied. See the License for the23 * specific language governing permissions and limitations24 * under the License.25 */26/*27 * Modifications Copyright OpenSearch Contributors. See28 * GitHub history for details.29 */30import { PersistedState } from './persisted_state';31describe('Persisted State Provider', () => {32 describe('state creation', () => {33 let persistedState: PersistedState;34 test('should create an empty state instance', () => {35 persistedState = new PersistedState();36 expect(persistedState.get()).toEqual({});37 });38 test('should create a state instance with data', () => {39 const val = { red: 'blue' };40 persistedState = new PersistedState(val);41 expect(persistedState.get()).toEqual(val);42 // ensure we get a copy of the state, not the actual state object43 expect(persistedState.get()).not.toBe(val);44 });45 test('should create a copy of the state passed in', () => {46 const val = { red: 'blue' };47 persistedState = new PersistedState(val);48 expect(persistedState.get()).toEqual(val);49 expect(persistedState.get()).not.toBe(val);50 });51 test('should throw if given an invalid value', () => {52 expect(() => new PersistedState('bananas')).toThrow(Error);53 });54 });55 describe('mutation', () => {56 test('should not mutate the internal object', () => {57 const persistedStateValue = { hello: 'world' };58 const insertedObj = { farewell: 'cruel world' };59 const persistedState = new PersistedState(persistedStateValue);60 expect({61 ...persistedState.get(),62 ...insertedObj,63 }).toHaveProperty('farewell');64 expect(persistedState.get()).not.toHaveProperty('farewell');65 });66 });67 describe('JSON importing and exporting', () => {68 let persistedStateValue: any;69 beforeEach(() => {70 persistedStateValue = { one: 1, two: 2, 'meaning of life': 42 };71 });72 describe('exporting state to JSON', () => {73 test('should return the full JSON representation', () => {74 const persistedState = new PersistedState(persistedStateValue);75 const json = persistedState.toJSON();76 expect(json).toEqual(persistedStateValue);77 });78 });79 describe('importing state from JSON string (hydration)', () => {80 test('should set the state from JSON string input', () => {81 const stateJSON = JSON.stringify(persistedStateValue);82 const persistedState = new PersistedState();83 expect(persistedState.get()).toEqual({});84 persistedState.fromString(stateJSON);85 expect(persistedState.get()).toEqual(persistedStateValue);86 });87 });88 });89 describe('get state', () => {90 test('should perform deep gets with various formats', () => {91 const obj = {92 red: {93 green: {94 blue: 'yellow',95 },96 },97 orange: [1, 2, false, 4],98 purple: {99 violet: '',100 },101 };102 const persistedState = new PersistedState(obj);103 expect(persistedState.get()).toEqual(obj);104 expect(persistedState.get('red')).toEqual({ green: { blue: 'yellow' } });105 expect(persistedState.get('red.green')).toEqual({ blue: 'yellow' });106 expect(persistedState.get('red[green]')).toEqual({ blue: 'yellow' });107 expect(persistedState.get(['red', 'green'])).toEqual({ blue: 'yellow' });108 expect(persistedState.get('red.green.blue')).toEqual('yellow');109 expect(persistedState.get('red[green].blue')).toEqual('yellow');110 expect(persistedState.get('red.green[blue]')).toEqual('yellow');111 expect(persistedState.get('red[green][blue]')).toEqual('yellow');112 expect(persistedState.get('red.green.blue')).toEqual('yellow');113 expect(persistedState.get('orange')).toEqual([1, 2, false, 4]);114 expect(persistedState.get('orange[0]')).toEqual(1);115 expect(persistedState.get('orange[2]')).toEqual(false);116 expect(persistedState.get('purple')).toEqual({ violet: '' });117 });118 test('should perform deep gets with arrays', () => {119 const persistedState = new PersistedState({120 hello: { nouns: ['world', 'humans', 'everyone'] },121 });122 expect(persistedState.get()).toEqual({ hello: { nouns: ['world', 'humans', 'everyone'] } });123 expect(persistedState.get('hello')).toEqual({ nouns: ['world', 'humans', 'everyone'] });124 expect(persistedState.get('hello.nouns')).toEqual(['world', 'humans', 'everyone']);125 });126 });127 describe('set state', () => {128 describe('path format support', () => {129 test('should create deep objects from dot notation', () => {130 const persistedState = new PersistedState();131 persistedState.set('one.two.three', 4);132 expect(persistedState.get()).toEqual({ one: { two: { three: 4 } } });133 });134 test('should create deep objects from array notation', () => {135 const persistedState = new PersistedState();136 persistedState.set('one[two][three]', 4);137 expect(persistedState.get()).toEqual({ one: { two: { three: 4 } } });138 });139 test('should create deep objects from arrays', () => {140 const persistedState = new PersistedState();141 persistedState.set(['one', 'two', 'three'], 4);142 expect(persistedState.get()).toEqual({ one: { two: { three: 4 } } });143 });144 test('should create deep objects with an existing path', () => {145 const persistedState = new PersistedState({}, 'deep.path');146 persistedState.set('green[red].blue', 4);147 expect(persistedState.get()).toEqual({ green: { red: { blue: 4 } } });148 });149 });150 describe('simple replace operations', () => {151 let persistedState;152 test('should replace value with string', () => {153 persistedState = new PersistedState({ hello: 'world' });154 expect(persistedState.get()).toEqual({ hello: 'world' });155 persistedState.set('hello', 'fare thee well');156 expect(persistedState.get()).toEqual({ hello: 'fare thee well' });157 });158 test('should replace value with array', () => {159 persistedState = new PersistedState({ hello: ['world', 'everyone'] });160 expect(persistedState.get()).toEqual({ hello: ['world', 'everyone'] });161 persistedState.set('hello', ['people']);162 expect(persistedState.get()).toEqual({ hello: ['people'] });163 });164 test('should replace value with object', () => {165 persistedState = new PersistedState({ hello: 'world' });166 expect(persistedState.get()).toEqual({ hello: 'world' });167 persistedState.set('hello', { message: 'fare thee well' });168 expect(persistedState.get()).toEqual({ hello: { message: 'fare thee well' } });169 });170 test('should replace value with object, removing old properties', () => {171 persistedState = new PersistedState({ hello: { message: 'world' } });172 expect(persistedState.get()).toEqual({ hello: { message: 'world' } });173 persistedState.set('hello', { length: 5 });174 expect(persistedState.get()).toEqual({ hello: { length: 5 } });175 });176 });177 describe('deep replace operations', () => {178 let persistedState;179 test('should append to the object', () => {180 persistedState = new PersistedState({ hello: { message: 'world' } });181 expect(persistedState.get()).toEqual({ hello: { message: 'world' } });182 persistedState.set('hello.length', 5);183 expect(persistedState.get()).toEqual({ hello: { message: 'world', length: 5 } });184 });185 test('should change the value in the array', () => {186 persistedState = new PersistedState({ hello: { nouns: ['world', 'humans', 'everyone'] } });187 persistedState.set('hello.nouns[1]', 'aliens');188 expect(persistedState.get()).toEqual({ hello: { nouns: ['world', 'aliens', 'everyone'] } });189 expect(persistedState.get('hello')).toEqual({ nouns: ['world', 'aliens', 'everyone'] });190 expect(persistedState.get('hello.nouns')).toEqual(['world', 'aliens', 'everyone']);191 });192 });193 });194 describe('internal state tracking', () => {195 test('should be an empty object', () => {196 const persistedState = new PersistedState();197 expect(persistedState).toHaveProperty('_defaultState', {});198 });199 test('should store the default state value', () => {200 const val = { one: 1, two: 2 };201 const persistedState = new PersistedState(val);202 expect(persistedState).toHaveProperty('_defaultState', val);203 });204 test('should keep track of changes', () => {205 const val = { one: 1, two: 2 };206 const persistedState = new PersistedState(val);207 persistedState.set('two', 22);208 expect(persistedState).toHaveProperty('_defaultState', val);209 expect(persistedState).toHaveProperty('_changedState', { two: 22 });210 });211 });212 describe('events', () => {213 let persistedState: PersistedState;214 let emitSpy: jest.SpyInstance;215 const getByType = (type: string): any[] => {216 return emitSpy.mock.calls.filter(([callType]) => callType === type);217 };218 const watchEmitter = (state: any) => {219 return jest.spyOn(state, 'emit');220 };221 beforeEach(() => {222 persistedState = new PersistedState({ checker: { events: 'event tests' } });223 emitSpy = watchEmitter(persistedState);224 });225 afterEach(() => {226 emitSpy.mockRestore();227 });228 test('should emit set when setting values', () => {229 expect(getByType('set')).toHaveLength(0);230 persistedState.set('checker.time', 'now');231 expect(getByType('set')).toHaveLength(1);232 });233 test('should not emit when setting value silently', () => {234 expect(getByType('set')).toHaveLength(0);235 persistedState.setSilent('checker.time', 'now');236 expect(getByType('set')).toHaveLength(0);237 });238 test('should emit change when changing values', () => {239 expect(getByType('change')).toHaveLength(0);240 persistedState.set('checker.time', 'now');241 expect(getByType('change')).toHaveLength(1);242 });243 test('should not emit when changing values silently', () => {244 expect(getByType('change')).toHaveLength(0);245 persistedState.setSilent('checker.time', 'now');246 expect(getByType('change')).toHaveLength(0);247 });248 test('should not emit change when values are identical', () => {249 expect(getByType('change')).toHaveLength(0);250 // check both forms of setting the same value251 persistedState.set('checker', { events: 'event tests' });252 expect(getByType('change')).toHaveLength(0);253 persistedState.set('checker.events', 'event tests');254 expect(getByType('change')).toHaveLength(0);255 });256 test('should emit change when values change', () => {257 expect(getByType('change')).toHaveLength(0);258 persistedState.set('checker.events', 'i changed');259 expect(getByType('change')).toHaveLength(1);260 });261 });...
Using AI Code Generation
1import { storiesOf } from '@storybook/react';2import { withKnobs, boolean } from '@storybook/addon-knobs';3import { withInfo } from '@storybook/addon-info';4import { withReadme } from 'storybook-readme';5import { withA11y } from '@storybook/addon-a11y';6import { withTests } from '@storybook/addon-jest';7import results from '../.jest-test-results.json';8import { withOptions } from '@storybook/addon-options';9import { withViewport } from '@storybook/addon-viewport';10import readme from './README.md';11storiesOf('Component', module)12 .addDecorator(withKnobs)13 .addDecorator(withInfo)14 .addDecorator(withReadme(readme))15 .addDecorator(withA11y)16 .addDecorator(withTests({ results }))17 .addDecorator(18 withOptions({
Using AI Code Generation
1import { withInfo } from '../../.storybook/addons/info/src/index';2import { withNotes } from '../../.storybook/addons/notes/src/index';3import { withKnobs } from '../../.storybook/addons/knobs/src/index';4import { storiesOf } from '@storybook/react';5import { action } from '@storybook/addon-actions';6import { linkTo } from '@storybook/addon-links';7import Button from '../Button';8import Welcome from './Welcome';9storiesOf('Welcome', module).add('to Storybook', () => <Welcome showApp={linkTo('Button')} />);10storiesOf('Button', module)11 .addDecorator(withInfo)12 .addDecorator(withNotes)13 .addDecorator(withKnobs)14 .add('with text', () => <Button onClick={action('clicked')}>Hello Button</Button>)15 .add('with some emoji', () => (16 <Button onClick={action('clicked')}>17 .add('with notes', () => (18 <Button onClick={action('clicked')}>19 ), { notes: 'A very simple component' });
Using AI Code Generation
1const { storybookRoot } = require('storybook-root');2const { getStorybookRoot } = storybookRoot;3const root = getStorybookRoot();4const { storybookRoot } = require('storybook-root');5const { getStorybookRoot } = storybookRoot;6const root = getStorybookRoot();7const { storybookRoot } = require('storybook-root');8const { getStorybookRoot } = storybookRoot;9const root = getStorybookRoot();10const { storybookRoot } = require('storybook-root');11const { getStorybookRoot } = storybookRoot;12const root = getStorybookRoot();13const { storybookRoot } = require('storybook-root');14const { getStorybookRoot } = storybookRoot;15const root = getStorybookRoot();16const { storybookRoot } = require('storybook-root');17const { getStorybookRoot } = storybookRoot;18const root = getStorybookRoot();19const { storybookRoot } = require('storybook-root');20const { getStorybookRoot } = storybookRoot;21const root = getStorybookRoot();22const { storybookRoot } = require('storybook-root');23const { getStorybookRoot } = storybookRoot;24const root = getStorybookRoot();25const { storybookRoot } = require('storybook-root');26const { getStorybookRoot } = storybookRoot;27const root = getStorybookRoot();28const { storybookRoot } = require('storybook-root');29const { getStorybookRoot } = storybookRoot;30const root = getStorybookRoot();31const { storybookRoot } = require('storybook-root');32const { getStorybookRoot } = storybookRoot;33const root = getStorybookRoot();34const { storybookRoot } = require
Automation Testing Tutorials
Learn to execute automation testing from scratch with LambdaTest Learning Hub. Right from setting up the prerequisites to run your first automation test, to following best practices and diving deeper into advanced test scenarios. LambdaTest Learning Hubs compile a list of step-by-step guides to help you be proficient with different test automation frameworks i.e. Selenium, Cypress, TestNG etc.
LambdaTest Learning Hubs:
- JUnit Tutorial
- TestNG Tutorial
- Webdriver Tutorial
- WebDriverIO Tutorial
- Protractor Tutorial
- Selenium 4 Tutorial
- Jenkins Tutorial
- NUnit Tutorial
- Jest Tutorial
- Playwright Tutorial
- Cypress Tutorial
- PyTest Tutorial
YouTube
You could also refer to video tutorials over LambdaTest YouTube channel to get step by step demonstration from industry experts.
Run storybook-root automation tests on LambdaTest cloud grid
Perform automation testing on 3000+ real desktop and mobile devices online.
Try LambdaTest Now !!
Get 100 minutes of automation test minutes FREE!!
Was this article helpful?
