10.18.4

Silent input changes might be overwritten due to the debounce logic present inside inputChange.

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "cyberchef",
-  "version": "10.18.0",
+  "version": "10.18.4",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "cyberchef",
-      "version": "10.18.0",
+      "version": "10.18.4",
       "hasInstallScript": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -115,7 +115,7 @@
         "babel-plugin-dynamic-import-node": "^2.3.3",
         "babel-plugin-transform-builtin-extend": "1.1.2",
         "base64-loader": "^1.0.0",
-        "chromedriver": "^122.0.0",
+        "chromedriver": "^123.0.4",
         "cli-progress": "^3.12.0",
         "colors": "^1.4.0",
         "copy-webpack-plugin": "^12.0.2",
@@ -4744,9 +4744,9 @@
       }
     },
     "node_modules/chromedriver": {
-      "version": "122.0.6",
-      "resolved": "https://registry.npmjs.org/chromedriver/-/chromedriver-122.0.6.tgz",
-      "integrity": "sha512-Q0r+QlUtiJWMQ5HdYaFa0CtBmLFq3n5JWfmq9mOC00UMBvWxku09gUkvBt457QnYfTM/XHqY/HTFOxHvATnTmA==",
+      "version": "123.0.4",
+      "resolved": "https://registry.npmjs.org/chromedriver/-/chromedriver-123.0.4.tgz",
+      "integrity": "sha512-3Yi7y7q35kkSAOTbRisiww/SL2w+DqafDPAaUShpSuLMmPaOvHQR0i3bm2/33QBiQ8fUb1J/MzppzVL6IDqvhA==",
       "dev": true,
       "hasInstallScript": true,
       "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "cyberchef",
-  "version": "10.18.0",
+  "version": "10.18.4",
   "description": "The Cyber Swiss Army Knife for encryption, encoding, compression and data analysis.",
   "author": "n1474335 <n1474335@gmail.com>",
   "homepage": "https://gchq.github.io/CyberChef",
@@ -55,7 +55,7 @@
     "babel-plugin-dynamic-import-node": "^2.3.3",
     "babel-plugin-transform-builtin-extend": "1.1.2",
     "base64-loader": "^1.0.0",
-    "chromedriver": "^122.0.0",
+    "chromedriver": "^123.0.4",
     "cli-progress": "^3.12.0",
     "colors": "^1.4.0",
     "copy-webpack-plugin": "^12.0.2",
@@ -96,6 +96,7 @@
     "@babel/polyfill": "^7.12.1",
     "@blu3r4y/lzma": "^2.3.3",
     "@wavesenterprise/crypto-gost-js": "^2.1.0-RC1",
+    "@xmldom/xmldom": "^0.8.0",
     "argon2-browser": "^1.18.0",
     "arrive": "^2.4.1",
     "avsc": "^5.7.7",
@@ -122,12 +123,12 @@
     "escodegen": "^2.1.0",
     "esprima": "^4.0.1",
     "exif-parser": "^0.1.12",
-    "ieee754": "^1.1.13",
     "fernet": "^0.3.2",
     "file-saver": "^2.0.5",
     "flat": "^6.0.1",
     "geodesy": "1.1.3",
     "highlight.js": "^11.9.0",
+    "ieee754": "^1.1.13",
     "jimp": "^0.16.13",
     "jquery": "3.7.1",
     "js-crc": "^0.2.0",
@@ -175,7 +176,6 @@
     "unorm": "^1.6.0",
     "utf8": "^3.0.0",
     "vkbeautify": "^0.99.3",
-    "@xmldom/xmldom": "^0.8.0",
     "xpath": "0.0.34",
     "xregexp": "^5.1.1",
     "zlibjs": "^0.3.1"

src/web/App.mjs

@@ -39,7 +39,6 @@ class App {
 
         this.baking        = false;
         this.autoBake_     = false;
-        this.autoBakePause = false;
         this.progress      = 0;
         this.ingId         = 0;
 
@@ -155,11 +154,6 @@ class App {
      * Runs Auto Bake if it is set.
      */
     autoBake() {
-        // If autoBakePause is set, we are loading a full recipe (and potentially input), so there is no
-        // need to set the staleness indicator. Just exit and wait until auto bake is called after loading
-        // has completed.
-        if (this.autoBakePause) return false;
-
         if (this.baking) {
             this.manager.worker.cancelBakeForAutoBake();
             this.baking = false;
@@ -478,7 +472,6 @@ class App {
      * @fires Manager#statechange
      */
     loadURIParams(params=this.getURIParams()) {
-        this.autoBakePause = true;
         this.uriParams = params;
 
         // Read in recipe from URI params
@@ -507,7 +500,7 @@ class App {
         // Input Character Encoding
         // Must be set before the input is loaded
         if (this.uriParams.ienc) {
-            this.manager.input.chrEncChange(parseInt(this.uriParams.ienc, 10), true);
+            this.manager.input.chrEncChange(parseInt(this.uriParams.ienc, 10), true, true);
         }
 
         // Output Character Encoding
@@ -545,7 +538,6 @@ class App {
             this.manager.options.changeTheme(Utils.escapeHtml(this.uriParams.theme));
         }
 
-        this.autoBakePause = false;
         window.dispatchEvent(this.manager.statechange);
     }
 
@@ -579,10 +571,6 @@ class App {
     setRecipeConfig(recipeConfig) {
         document.getElementById("rec-list").innerHTML = null;
 
-        // Pause auto-bake while loading but don't modify `this.autoBake_`
-        // otherwise `manualBake` cannot trigger.
-        this.autoBakePause = true;
-
         for (let i = 0; i < recipeConfig.length; i++) {
             const item = this.manager.recipe.addOperation(recipeConfig[i].op);
 
@@ -617,9 +605,6 @@ class App {
 
             this.progress = 0;
         }
-
-        // Unpause auto bake
-        this.autoBakePause = false;
     }
 
 

src/web/HTMLCategory.mjs

@@ -42,6 +42,9 @@ class HTMLCategory {
         let html = `<div class="panel category">
         <a class="category-title" data-toggle="collapse" data-target="#${catName}">
             ${this.name}
+            <span class="op-count hidden">
+                ${this.opList.length}
+            </span>
         </a>
         <div id="${catName}" class="panel-collapse collapse ${(this.selected ? " show" : "")}" data-parent="#categories">
             <ul class="op-list">`;

src/web/Manager.mjs

@@ -229,6 +229,7 @@ class Manager {
         this.addDynamicListener(".option-item input[type=checkbox]", "change", this.options.switchChange, this.options);
         this.addDynamicListener(".option-item input[type=checkbox]#wordWrap", "change", this.options.setWordWrap, this.options);
         this.addDynamicListener(".option-item input[type=checkbox]#useMetaKey", "change", this.bindings.updateKeybList, this.bindings);
+        this.addDynamicListener(".option-item input[type=checkbox]#showCatCount", "change", this.ops.setCatCount, this.ops);
         this.addDynamicListener(".option-item input[type=number]", "keyup", this.options.numberChange, this.options);
         this.addDynamicListener(".option-item input[type=number]", "change", this.options.numberChange, this.options);
         this.addDynamicListener(".option-item select", "change", this.options.selectChange, this.options);

src/web/html/index.html

@@ -171,6 +171,7 @@
                 <div id="operations" class="split split-horizontal no-select">
                     <div class="title no-select" data-help-title="Operations list" data-help="<p>The Operations list contains all the operations in CyberChef arranged into categories. Some operations may be present in multiple categories. You can search for operations using the search box.</p><p>To use an operation, either double click it, or drag it into the Recipe pane. You will then be able to configure its arguments (or 'Ingredients' in CyberChef terminology).</p>">
                         Operations
+                        <span class="op-count"></span>
                     </div>
                     <input id="search" type="search" class="form-control" placeholder="Search..." autocomplete="off" tabindex="2" data-help-title="Searching for operations" data-help="<p>Use the search box to find useful operations.</p><p>Both operation names and descriptions are queried using a fuzzy matching algorithm.</p>">
                     <ul id="search-results" class="op-list"></ul>
@@ -521,6 +522,13 @@
                                 Keep the current tab in sync between the input and output
                             </label>
                         </div>
+
+                        <div class="checkbox option-item">
+                            <label for="showCatCount">
+                                <input type="checkbox" option="showCatCount" id="showCatCount">
+                                Show the number of operations in each category
+                            </label>
+                        </div>
                     </div>
                     <div class="modal-footer">
                         <button type="button" class="btn btn-secondary" id="reset-options">Reset options to default</button>

src/web/index.js

@@ -51,7 +51,8 @@ function main() {
         logLevel:            "info",
         autoMagic:           true,
         imagePreview:        true,
-        syncTabs:            true
+        syncTabs:            true,
+        showCatCount:        false,
     };
 
     document.removeEventListener("DOMContentLoaded", main, false);

src/web/stylesheets/components/_list.css

@@ -40,4 +40,13 @@
     margin: 0 !important;
     border-radius: 0 !important;
     border: none;
-}
+}
+
+.op-count {
+    float: right;
+    color: var(--subtext-font-colour);
+    font-weight: normal;
+    font-size: xx-small;
+    opacity: 0.5;
+    padding-left: .5em;
+}

src/web/stylesheets/utils/_general.css

@@ -36,6 +36,10 @@ body {
     line-height: 0;
 }
 
+.hidden {
+    display: none;
+}
+
 .blur {
     color: transparent !important;
     text-shadow: rgba(0, 0, 0, 0.95) 0 0 10px !important;

src/web/waiters/InputWaiter.mjs

@@ -215,13 +215,16 @@ class InputWaiter {
      * Handler for Chr Enc change events
      * Sets the input character encoding
      * @param {number} chrEncVal
-     * @param {boolean} [manual=false]
+     * @param {boolean} [manual=false] - Flag to indicate the encoding was set by the user
+     * @param {boolean} [internal=false] - Flag to indicate this was set internally, i.e. by loading from URI
      */
-    chrEncChange(chrEncVal, manual=false) {
+    chrEncChange(chrEncVal, manual=false, internal=false) {
         if (typeof chrEncVal !== "number") return;
         this.inputChrEnc = chrEncVal;
         this.encodingState = manual ? 2 : this.encodingState;
-        this.inputChange();
+        if (!internal) {
+            this.inputChange();
+        }
     }
 
     /**
@@ -639,10 +642,6 @@ class InputWaiter {
                 const inputStr = toBase64(inputVal, "A-Za-z0-9+/");
                 this.app.updateURL(true, inputStr);
             }
-
-            // Trigger a state change
-            if (!silent) window.dispatchEvent(this.manager.statechange);
-
         }.bind(this));
     }
 

src/web/waiters/OperationsWaiter.mjs

@@ -168,6 +168,10 @@ class OperationsWaiter {
      */
     opListCreate(e) {
         this.manager.recipe.createSortableSeedList(e.target);
+
+        // Populate ops total
+        document.querySelector("#operations .title .op-count").innerText = Object.keys(this.app.operations).length;
+
         this.enableOpsListPopovers(e.target);
     }
 
@@ -293,6 +297,18 @@ class OperationsWaiter {
         this.app.resetFavourites();
     }
 
+
+    /**
+     * Sets whether operation counts are displayed next to a category title
+     */
+    setCatCount() {
+        if (this.app.options.showCatCount) {
+            document.querySelectorAll(".category-title .op-count").forEach(el => el.classList.remove("hidden"));
+        } else {
+            document.querySelectorAll(".category-title .op-count").forEach(el => el.classList.add("hidden"));
+        }
+    }
+
 }
 
 export default OperationsWaiter;

src/web/waiters/OptionsWaiter.mjs

@@ -50,6 +50,7 @@ class OptionsWaiter {
 
         // Initialise options
         this.setWordWrap();
+        this.manager.ops.setCatCount();
     }
 
 

tests/browser/01_io.js

@@ -174,16 +174,19 @@ module.exports = {
         browser.waitForElementVisible("#stale-indicator");
 
         // Enable previously disabled autobake
+        browser.expect.element("#auto-bake").to.not.be.selected;
         browser.click("#auto-bake-label");
+        browser.expect.element("#auto-bake").to.be.selected.before(1000);
 
+        // Add content to the input
+        browser.pause(100);
         browser.sendKeys("#input-text .cm-content", "1");
-
+        browser.waitForElementVisible("#output-loader");
         browser.pause(500);
 
         // Make another change while the previous input is being baked
-        browser.sendKeys("#input-text .cm-content", "2");
-
         browser
+            .sendKeys("#input-text .cm-content", "2")
             .waitForElementNotVisible("#stale-indicator")
             .waitForElementNotVisible("#output-loader");
 
@@ -192,6 +195,7 @@ module.exports = {
 
         // Turn autobake off again
         browser.click("#auto-bake-label");
+        browser.expect.element("#auto-bake").to.not.be.selected.before(1000);
     },
 
     "Special content": browser => {

tests/browser/browserUtils.js

@@ -39,6 +39,7 @@ function setInput(browser, input, type=true) {
         browser.execute(text => {
             window.app.setInput(text);
         }, [input]);
+        browser.pause(100);
     }
 }