@uxf/core 11.124.0 → 11.126.0

package/README.md

@@ -3,24 +3,26 @@
 ## Constants
 
 - common modifier classnames for interactive elements (eg. `CLASSES.IS_HOVERABLE` for is-hoverable classname)
-  - `focus-visible`
-  - `is-active`
-  - `is-busy`
-  - `is-disabled`
-  - `is-focused`
-  - `is-hoverable`
-  - `is-hovered`
-  - `is-invalid`
-  - `is-loading`
-  - `is-not-hoverable`
-  - `is-readonly`
-  - `is-required`
-  - `is-selected`
+    - `focus-visible`
+    - `is-active`
+    - `is-busy`
+    - `is-disabled`
+    - `is-focused`
+    - `is-hoverable`
+    - `is-hovered`
+    - `is-invalid`
+    - `is-loading`
+    - `is-not-hoverable`
+    - `is-readonly`
+    - `is-required`
+    - `is-selected`
 
 ## Resizer
+
 !!! Required [@uxf/resizer](https://www.npmjs.com/package/@uxf/resizer) version `>= 2.3.2` which supported `quality` parameter.
 
 ### Config
+
 ```json
 [
     {
@@ -37,19 +39,19 @@
 ### Usage for generated images
 
 ```tsx
-import {resizerImageUrl} from "@uxf/core/utils/resizer";
+import { resizerImageUrl } from "@uxf/core/utils/resizer";
 
-<img src={resizerImageUrl(file, width, height, params)}/>
+<img src={resizerImageUrl(file, width, height, params)} />;
 ```
 
 ### Usage for static images
 
 ```tsx
-import {resizerImageUrl} from "@uxf/core/utils/resizer";
+import { resizerImageUrl } from "@uxf/core/utils/resizer";
 
 import staticImage from "./path/to/static-image.png";
 
-<img src={resizerImageUrl(staticImage, width, height, params)}/>
+<img src={resizerImageUrl(staticImage, width, height, params)} />;
 ```
 
 ## QR code generator
@@ -93,43 +95,49 @@ cookie.delete("cookie-name", /* options (optional) */);
 Dynamically adjusts the height of a `<textarea>` based on its content and an optional number of rows.
 
 #### Parameters
+
 - **`element`**: The `<textarea>` to adjust.
 - **`rows`** (optional): Minimum visible rows. Default is `4`.
 
 #### Behavior
+
 - Leverages MutationObserver API to measure content height.
 - Adjusts height to fit content or the minimum height based on the `rows` parameter, calculated using `line-height` and `font-size`.
 
 #### Usage
+
 ```typescript
 adjustTextareaHeight(textarea); // Adjusts height (min 4 rows)
 adjustTextareaHeight(textarea, 6); // With 6-row minimum
-``` 
+```
+
 In React component:
+
 ```tsx
 import { useIsomorphicLayoutEffect } from "@uxf/core-react/hooks/use-isomorphic-layout-effect";
 import { isNotNil } from "@uxf/core/utils/is-not-nil";
 
 useIsomorphicLayoutEffect(() => {
-  const textarea = textareaRef.current;
-
-  if (isNotNil(textarea)) {
-      return;
-  }
-  
-  const cleanup = adjustTextareaHeight(textarea);
-  
-  return () => cleanup();
+    const textarea = textareaRef.current;
+
+    if (isNotNil(textarea)) {
+        return;
+    }
+
+    const cleanup = adjustTextareaHeight(textarea);
+
+    return () => cleanup();
 }, []);
-``` 
+```
 
 > **Note**: Requires valid `line-height` and `font-size` styles for accurate sizing.
 
 ### assertNever
 
 Checks that value is always type "never".
+
 ```ts
-switch(value) {
+switch (value) {
     case "a":
         return "A";
     case "b":
@@ -209,9 +217,11 @@ const example = <div ref={composeRefs(firstRef, secondRef)} />;
 ```
 
 ### cx, cxa
+
 It is our fork of `clsx` library https://github.com/lukeed/clsx
 
 We will mainly use `cx`, which is fork of `clsx/lite` – it accepts **ONLY** string values! Any non-string arguments are ignored!
+
 ```tsx
 import { cx } from "@uxf/core/utils/cx";
 
@@ -224,9 +234,10 @@ cx({ foo: true });
 //=> ""
 ```
 
-The `cxa` function is full fork of `clsx` and can take *any* number of arguments, each of which can be an Object, Array, Boolean, or String.
+The `cxa` function is full fork of `clsx` and can take _any_ number of arguments, each of which can be an Object, Array, Boolean, or String.
 
 **Important**: Any falsy values are discarded! Standalone Boolean values are discarded as well.
+
 ```tsx
 import { cxa } from "@uxf/core/utils/cxa";
 
@@ -238,11 +249,11 @@ cxa("foo", true && "bar", "baz");
 //=> "foo bar baz"
 
 // Objects
-cxa({ foo:true, bar:false, baz:isTrue() });
+cxa({ foo: true, bar: false, baz: isTrue() });
 //=> "foo baz"
 
 // Objects (variadic)
-cxa({ foo:true }, { bar:false }, null, { "--foobar":"hello" });
+cxa({ foo: true }, { bar: false }, null, { "--foobar": "hello" });
 //=> "foo --foobar"
 
 // Arrays
@@ -254,7 +265,7 @@ cxa(["foo"], ["", 0, false, "bar"], [["baz", [["hello"], "there"]]]);
 //=> "foo bar baz hello there"
 
 // Kitchen sink (with nesting)
-cxa("foo", [1 && "bar", { baz:false, bat:null }, ["hello", ["world"]]], "cya");
+cxa("foo", [1 && "bar", { baz: false, bat: null }, ["hello", ["world"]]], "cya");
 //=> "foo bar hello world cya"
 ```
 
@@ -285,11 +296,20 @@ const a = { b: 2, a: 1, nested: { y: 2, x: 1 } };
 const b = { nested: { x: 1, y: 2 }, a: 1, b: 2 };
 console.log(deepEqualIgnoringKeyOrder(a, b)); // true
 
-const arr1 = [{ a: 1, b: 2 }, { c: 3, d: 4 }];
-const arr2 = [{ b: 2, a: 1 }, { d: 4, c: 3 }];
+const arr1 = [
+    { a: 1, b: 2 },
+    { c: 3, d: 4 },
+];
+const arr2 = [
+    { b: 2, a: 1 },
+    { d: 4, c: 3 },
+];
 console.log(deepEqualIgnoringKeyOrder(arr1, arr2)); // true (objects equal, same array order)
 
-const arr3 = [{ d: 4, c: 3 }, { b: 2, a: 1 }];
+const arr3 = [
+    { d: 4, c: 3 },
+    { b: 2, a: 1 },
+];
 console.log(deepEqualIgnoringKeyOrder(arr1, arr3)); // false (array order differs)
 ```
 
@@ -302,7 +322,7 @@ import { downloadFile } from "@uxf/core/utils/download-file";
 import { FormEventHandler } from "react";
 
 const submitHandler: FormEventHandler<HTMLFormElement> = () => {
-    downloadFile("https://example.com/file", "file.txt")
+    downloadFile("https://example.com/file", "file.txt");
 };
 ```
 
@@ -313,7 +333,7 @@ Escapes all double quotes (`"`) in a string by replacing them with `\"`.
 ```ts
 import { escapeQuotes } from "@uxf/core/utils/escape-quotes";
 
-escapeQuotes('The "quick" fox'); 
+escapeQuotes('The "quick" fox');
 // Output: The \"quick\" fox
 ```
 
@@ -324,9 +344,9 @@ Converts a 0-based index to a 1-based (human-readable) index.
 ```tsx
 import { humanIndex } from "@uxf/core/utils/human-index";
 
-humanIndex(0);  /* returns 1 */
-humanIndex(9);  /* returns 10 */
-humanIndex(-1);  /* throws error */
+humanIndex(0); /* returns 1 */
+humanIndex(9); /* returns 10 */
+humanIndex(-1); /* throws error */
 ```
 
 ## filterNullish
@@ -369,7 +389,7 @@ const props = {
 const htmlAttrs = filterAriaAndDataAttrs(props);
 // Result: { "aria-label": "Close button", "data-testid": "close-btn" }
 
-<button {...htmlAttrs}>Close</button>
+<button {...htmlAttrs}>Close</button>;
 ```
 
 ```tsx
@@ -380,16 +400,13 @@ function CustomInput({ label, onChange, ...restProps }) {
     return <input {...accessibilityAttrs} onChange={onChange} />;
 }
 
-<CustomInput
-    aria-describedby="helper-text"
-    data-analytics="email-input"
-    customProp="ignored"
-/>
+<CustomInput aria-describedby="helper-text" data-analytics="email-input" customProp="ignored" />;
 ```
 
 ### formatBytes
 
 Appends suitable unit to the byte value of data size.
+
 ```ts
 formatBytes(17.5 * 1024);
 //=> "17.5 kB"
@@ -423,7 +440,7 @@ Re-export of [lodash.isequal](https://lodash.com/docs/#isEqual). Performs a deep
 import { isEqual } from "@uxf/core/utils/is-equal";
 
 isEqual({ a: 1, b: [2, 3] }, { a: 1, b: [2, 3] }); /* returns true */
-isEqual({ a: 1 }, { a: 2 });                         /* returns false */
+isEqual({ a: 1 }, { a: 2 }); /* returns false */
 ```
 
 ## isEmpty
@@ -444,11 +461,11 @@ Checks if a number is even.
 ```tsx
 import { isEven } from "@uxf/core/utils/is-even";
 
-isEven(2);  /* returns true */
-isEven(4);  /* returns true */
-isEven(1);  /* returns false */
-isEven(3);  /* returns false */
-isEven(0);  /* returns true */
+isEven(2); /* returns true */
+isEven(4); /* returns true */
+isEven(1); /* returns false */
+isEven(3); /* returns false */
+isEven(0); /* returns true */
 isEven(-2); /* returns true */
 ```
 
@@ -459,11 +476,11 @@ Checks if a number is odd.
 ```tsx
 import { isOdd } from "@uxf/core/utils/is-odd";
 
-isOdd(1);  /* returns true */
-isOdd(3);  /* returns true */
-isOdd(2);  /* returns false */
-isOdd(4);  /* returns false */
-isOdd(0);  /* returns false */
+isOdd(1); /* returns true */
+isOdd(3); /* returns true */
+isOdd(2); /* returns false */
+isOdd(4); /* returns false */
+isOdd(0); /* returns false */
 isOdd(-1); /* returns true */
 ```
 
@@ -482,13 +499,13 @@ const serverExample = isServer; /* returns true if DOM is NOT available */
 ```tsx
 import { isNil } from "@uxf/core/utils/is-nil";
 
-isNil(null);      /* returns true */
+isNil(null); /* returns true */
 isNil(undefined); /* returns true */
-isNil(true);      /* returns false */
-isNil(1);         /* returns false */
-isNil(0);         /* returns false */
-isNil([]);        /* returns false */
-isNil("string");  /* returns false */
+isNil(true); /* returns false */
+isNil(1); /* returns false */
+isNil(0); /* returns false */
+isNil([]); /* returns false */
+isNil("string"); /* returns false */
 ```
 
 ## isNotNil
@@ -496,13 +513,13 @@ isNil("string");  /* returns false */
 ```tsx
 import { isNotNil } from "@uxf/core/utils/is-not-nil";
 
-isNotNil(null);      /* returns false */
+isNotNil(null); /* returns false */
 isNotNil(undefined); /* returns false */
-isNotNil(true);      /* returns true */
-isNotNil(1);         /* returns true */
-isNotNil(0);         /* returns true */
-isNotNil([]);        /* returns true */
-isNotNil("string");  /* returns true */
+isNotNil(true); /* returns true */
+isNotNil(1); /* returns true */
+isNotNil(0); /* returns true */
+isNotNil([]); /* returns true */
+isNotNil("string"); /* returns true */
 ```
 
 ## isNotNilNorEmpty
@@ -529,18 +546,18 @@ Type guard that checks if a value is a plain object. Returns `false` for arrays,
 ```tsx
 import { isPlainObject } from "@uxf/core/utils/is-plain-object";
 
-isPlainObject({});           /* returns true */
-isPlainObject({ a: 1 });     /* returns true */
-isPlainObject([]);           /* returns false */
-isPlainObject([1, 2, 3]);    /* returns false */
-isPlainObject(new Date());   /* returns false */
-isPlainObject(new Map());    /* returns false */
-isPlainObject(new Set());    /* returns false */
-isPlainObject(/regex/);      /* returns false */
-isPlainObject(null);         /* returns false */
-isPlainObject(undefined);    /* returns false */
-isPlainObject("string");     /* returns false */
-isPlainObject(123);          /* returns false */
+isPlainObject({}); /* returns true */
+isPlainObject({ a: 1 }); /* returns true */
+isPlainObject([]); /* returns false */
+isPlainObject([1, 2, 3]); /* returns false */
+isPlainObject(new Date()); /* returns false */
+isPlainObject(new Map()); /* returns false */
+isPlainObject(new Set()); /* returns false */
+isPlainObject(/regex/); /* returns false */
+isPlainObject(null); /* returns false */
+isPlainObject(undefined); /* returns false */
+isPlainObject("string"); /* returns false */
+isPlainObject(123); /* returns false */
 ```
 
 ## last
@@ -549,7 +566,7 @@ isPlainObject(123);          /* returns false */
 import { last } from "@uxf/core/utils/last";
 
 last([1, 2]); /* returns 2 */
-last([]);     /* returns undefined */
+last([]); /* returns undefined */
 ```
 
 ## nonEmptyArrayOrNull
@@ -559,11 +576,11 @@ Converts empty arrays, `null`, or `undefined` values to `null`, leaving all non-
 ```tsx
 import { nonEmptyArrayOrNull } from "@uxf/core/utils/non-empty-array-or-null";
 
-nonEmptyArrayOrNull([]);          /* returns null */
-nonEmptyArrayOrNull(null);        /* returns null */
-nonEmptyArrayOrNull(undefined);   /* returns null */
-nonEmptyArrayOrNull([1, 2, 3]);   /* returns [1, 2, 3] */
-nonEmptyArrayOrNull(["a", "b"]);  /* returns ["a", "b"] */
+nonEmptyArrayOrNull([]); /* returns null */
+nonEmptyArrayOrNull(null); /* returns null */
+nonEmptyArrayOrNull(undefined); /* returns null */
+nonEmptyArrayOrNull([1, 2, 3]); /* returns [1, 2, 3] */
+nonEmptyArrayOrNull(["a", "b"]); /* returns ["a", "b"] */
 ```
 
 ## nonEmptyStringOrNull
@@ -573,11 +590,11 @@ Converts empty strings and `undefined` values to `null`, leaving all other strin
 ```tsx
 import { nonEmptyStringOrNull } from "@uxf/core/utils/non-empty-string-or-null";
 
-nonEmptyStringOrNull("");         /* returns null */
-nonEmptyStringOrNull(undefined);  /* returns null */
-nonEmptyStringOrNull(null);       /* returns null */
-nonEmptyStringOrNull("test");     /* returns "test" */
-nonEmptyStringOrNull(" ");        /* returns " " - non-empty string */
+nonEmptyStringOrNull(""); /* returns null */
+nonEmptyStringOrNull(undefined); /* returns null */
+nonEmptyStringOrNull(null); /* returns null */
+nonEmptyStringOrNull("test"); /* returns "test" */
+nonEmptyStringOrNull(" "); /* returns " " - non-empty string */
 ```
 
 ## nullishToEmptyString
@@ -587,10 +604,10 @@ Converts `null` or `undefined` values to an empty string, leaving all other stri
 ```tsx
 import { nullishToEmptyString } from "@uxf/core/utils/nullish-to-empty-string";
 
-nullishToEmptyString(null);            /* returns "" */
-nullishToEmptyString(undefined);       /* returns "" */
-nullishToEmptyString("");              /* returns "" */
-nullishToEmptyString("hello world");   /* returns "hello world" */
+nullishToEmptyString(null); /* returns "" */
+nullishToEmptyString(undefined); /* returns "" */
+nullishToEmptyString(""); /* returns "" */
+nullishToEmptyString("hello world"); /* returns "hello world" */
 ```
 
 ## numberOrNull
@@ -600,13 +617,13 @@ Converts `NaN`, `null`, or `undefined` values to `null`, leaving all valid numbe
 ```tsx
 import { numberOrNull } from "@uxf/core/utils/number-or-null";
 
-numberOrNull(0);          /* returns 0 */
-numberOrNull(42);         /* returns 42 */
-numberOrNull(-1);         /* returns -1 */
-numberOrNull(3.14);       /* returns 3.14 */
-numberOrNull(NaN);        /* returns null */
-numberOrNull(null);       /* returns null */
-numberOrNull(undefined);  /* returns null */
+numberOrNull(0); /* returns 0 */
+numberOrNull(42); /* returns 42 */
+numberOrNull(-1); /* returns -1 */
+numberOrNull(3.14); /* returns 3.14 */
+numberOrNull(NaN); /* returns null */
+numberOrNull(null); /* returns null */
+numberOrNull(undefined); /* returns null */
 ```
 
 ## plural
@@ -639,7 +656,26 @@ Re-export of [qs](https://github.com/ljharb/qs). A querystring parsing and strin
 import { stringify, parse } from "@uxf/core/utils/qs";
 
 stringify({ a: "b", c: [1, 2] }); /* returns "a=b&c%5B0%5D=1&c%5B1%5D=2" */
-parse("a=b&c=1");                 /* returns { a: "b", c: "1" } */
+parse("a=b&c=1"); /* returns { a: "b", c: "1" } */
+```
+
+## safeLocalStorage / safeSessionStorage
+
+Web storage that never throws. Safari in private mode, iOS with cookies blocked, sandboxed iframes and several in-app browsers throw `SecurityError: The operation is insecure.` on **reads as well as writes** — and in some browsers even on the bare `window.localStorage` property access — so unguarded storage access during render can take the whole app down. A full quota throws `QuotaExceededError` the same way.
+
+A read that cannot happen returns `null`, a write that cannot happen returns `false`. The storage object is resolved per call, so importing this module on the server is safe.
+
+```tsx
+import { safeLocalStorage, safeSessionStorage } from "@uxf/core/utils/safe-storage";
+
+safeLocalStorage.setItem("theme", "dark"); /* returns true, or false when storage is unavailable */
+safeLocalStorage.getItem("theme"); /* returns "dark", or null when storage is unavailable */
+safeLocalStorage.removeItem("theme"); /* returns true when it went through */
+safeLocalStorage.clear(); /* returns true when it went through */
+safeLocalStorage.length; /* returns 0 when storage is unavailable */
+safeLocalStorage.key(0); /* returns null when storage is unavailable */
+
+safeSessionStorage.getItem("wizard-step"); /* same API for sessionStorage */
 ```
 
 ## slugify
@@ -685,10 +721,10 @@ const example = trimTrailingZeros("120,450"); /* returns "120,45" */
 ```
 
 ## Validators
+
 ```tsx
 import { Validator } from "@uxf/core";
 
 Validator.isEmail("...");
 Validator.isPhone("...");
 ```
-

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@uxf/core",
-    "version": "11.124.0",
+    "version": "11.126.0",
     "description": "UXF Core",
     "author": "Petr Vejvoda <vejvoda@uxf.cz>",
     "homepage": "https://gitlab.com/uxf-npm/core#readme",

package/utils/safe-storage.d.ts

@@ -0,0 +1,10 @@
+export interface SafeStorage {
+    clear: () => boolean;
+    getItem: (key: string) => string | null;
+    key: (index: number) => string | null;
+    readonly length: number;
+    removeItem: (key: string) => boolean;
+    setItem: (key: string, value: string) => boolean;
+}
+export declare const safeLocalStorage: SafeStorage;
+export declare const safeSessionStorage: SafeStorage;

package/utils/safe-storage.js

@@ -0,0 +1,108 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.safeSessionStorage = exports.safeLocalStorage = void 0;
+const is_browser_1 = require("./is-browser");
+const is_nil_1 = require("./is-nil");
+/**
+ * Web storage is not always usable. Safari in private mode, iOS with cookies blocked, sandboxed
+ * iframes and several in-app browsers throw `SecurityError: The operation is insecure.` — and a full
+ * quota throws `QuotaExceededError` — on **reads as well as writes**, and in some browsers even on
+ * the bare `window.localStorage` property access. An unguarded read during render therefore takes
+ * the whole app down.
+ *
+ * These wrappers never throw: a read that cannot happen returns `null`, a write that cannot happen
+ * returns `false`. The storage object is resolved per call, so a page that gains (or loses) access
+ * mid-session is handled too, and importing this module on the server is safe.
+ */
+function getWebStorage(name) {
+    if (!is_browser_1.isBrowser) {
+        return null;
+    }
+    try {
+        return window[name];
+    }
+    catch {
+        return null;
+    }
+}
+function createSafeStorage(name) {
+    return {
+        clear() {
+            const storage = getWebStorage(name);
+            if ((0, is_nil_1.isNil)(storage)) {
+                return false;
+            }
+            try {
+                storage.clear();
+                return true;
+            }
+            catch {
+                return false;
+            }
+        },
+        getItem(key) {
+            const storage = getWebStorage(name);
+            if ((0, is_nil_1.isNil)(storage)) {
+                return null;
+            }
+            try {
+                return storage.getItem(key);
+            }
+            catch {
+                return null;
+            }
+        },
+        key(index) {
+            const storage = getWebStorage(name);
+            if ((0, is_nil_1.isNil)(storage)) {
+                return null;
+            }
+            try {
+                return storage.key(index);
+            }
+            catch {
+                return null;
+            }
+        },
+        get length() {
+            const storage = getWebStorage(name);
+            if ((0, is_nil_1.isNil)(storage)) {
+                return 0;
+            }
+            try {
+                return storage.length;
+            }
+            catch {
+                return 0;
+            }
+        },
+        removeItem(key) {
+            const storage = getWebStorage(name);
+            if ((0, is_nil_1.isNil)(storage)) {
+                return false;
+            }
+            try {
+                storage.removeItem(key);
+                return true;
+            }
+            catch {
+                return false;
+            }
+        },
+        setItem(key, value) {
+            const storage = getWebStorage(name);
+            if ((0, is_nil_1.isNil)(storage)) {
+                return false;
+            }
+            try {
+                storage.setItem(key, value);
+                return true;
+            }
+            catch {
+                return false;
+            }
+        },
+    };
+}
+exports.safeLocalStorage = createSafeStorage("localStorage");
+exports.safeSessionStorage = createSafeStorage("sessionStorage");

package/utils/safe-storage.test.d.ts

@@ -0,0 +1 @@
+export {};

package/utils/safe-storage.test.js

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const safe_storage_1 = require("./safe-storage");
+function throwSecurityError() {
+    throw new DOMException("The operation is insecure.", "SecurityError");
+}
+describe.each([
+    ["safeLocalStorage", safe_storage_1.safeLocalStorage, window.localStorage],
+    ["safeSessionStorage", safe_storage_1.safeSessionStorage, window.sessionStorage],
+])("%s", (_name, safeStorage, storage) => {
+    beforeEach(() => {
+        jest.restoreAllMocks();
+        storage.clear();
+    });
+    describe("with a working storage", () => {
+        it("reads and writes", () => {
+            expect(safeStorage.getItem("theme")).toBeNull();
+            expect(safeStorage.setItem("theme", "dark")).toBe(true);
+            expect(safeStorage.getItem("theme")).toBe("dark");
+        });
+        it("removes and clears", () => {
+            safeStorage.setItem("theme", "dark");
+            expect(safeStorage.removeItem("theme")).toBe(true);
+            expect(safeStorage.getItem("theme")).toBeNull();
+            safeStorage.setItem("theme", "dark");
+            expect(safeStorage.clear()).toBe(true);
+            expect(safeStorage.length).toBe(0);
+        });
+        it("enumerates keys", () => {
+            safeStorage.setItem("theme", "dark");
+            expect(safeStorage.length).toBe(1);
+            expect(safeStorage.key(0)).toBe("theme");
+            expect(safeStorage.key(1)).toBeNull();
+        });
+    });
+    describe("with a storage that throws (private mode, blocked storage, full quota)", () => {
+        it("returns null instead of throwing on a read", () => {
+            jest.spyOn(Storage.prototype, "getItem").mockImplementation(throwSecurityError);
+            expect(() => safeStorage.getItem("theme")).not.toThrow();
+            expect(safeStorage.getItem("theme")).toBeNull();
+        });
+        it("returns false instead of throwing on a write", () => {
+            jest.spyOn(Storage.prototype, "setItem").mockImplementation(throwSecurityError);
+            jest.spyOn(Storage.prototype, "removeItem").mockImplementation(throwSecurityError);
+            jest.spyOn(Storage.prototype, "clear").mockImplementation(throwSecurityError);
+            expect(safeStorage.setItem("theme", "dark")).toBe(false);
+            expect(safeStorage.removeItem("theme")).toBe(false);
+            expect(safeStorage.clear()).toBe(false);
+        });
+        it("returns empty values instead of throwing on enumeration", () => {
+            jest.spyOn(Storage.prototype, "key").mockImplementation(throwSecurityError);
+            jest.spyOn(Storage.prototype, "length", "get").mockImplementation(throwSecurityError);
+            expect(safeStorage.key(0)).toBeNull();
+            expect(safeStorage.length).toBe(0);
+        });
+    });
+});