From e0f6a85e01ae9a8658d6a4234daf54403a2aec5f Mon Sep 17 00:00:00 2001
From: bjorn <bjorn@swis.nl>
Date: Wed, 29 Jul 2026 21:19:01 +0200
Subject: [PATCH 1/2] fix: accept a raw Element as the context option

`context` was normalised with `if (!o.context || !o.context.length)`, which
tested a shape that only jQuery objects and strings have. A raw DOM Element
has no `length` at all, so it was always dropped and the registration silently
fell back to `document`: the menu worked, but page-wide rather than scoped to
the element the caller passed. The same check misfired the other way for
`<form>` and `<select>` elements, whose `length` is their control/option count,
so an empty one was dropped and a non-empty one accepted.

Normalise by type instead: resolve the value once and keep it when it is an
element or the document, in the spirit of the existing isElementSelector()
helper used for `selector`. `o.context` stays a raw DOM node, which is what
every consumer expects (`$.contains(o.context, el)`, `o.context !== el`).

A context that resolves to no element now falls back to `document` as well.
Previously a selector string matching nothing left `o.context` undefined and
`$context` empty, so the registration was stored but bound to nothing at all
and could never fire.
---
 CHANGELOG.md                                  |   2 +
 documentation/docs.md                         |  32 +++
 src/jquery.contextMenu.js                     |  27 ++-
 .../issue-731-selector-html-injection.test.js |  13 +-
 test/unit/issue-809-context-element.test.js   | 187 ++++++++++++++++++
 5 files changed, 250 insertions(+), 11 deletions(-)
 create mode 100644 test/unit/issue-809-context-element.test.js

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 918b6628..7b147397 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -27,9 +27,11 @@
 * A `select`'s phantom mousedown is no longer treated as an outside click (fixes #744)
 * A re-dispatched layer click now targets the element actually clicked (fixes #771)
 * Guard against undefined `e.data` in the contextmenu handler (fixes #777)
+* A raw `Element` passed as `context` now scopes the registration instead of being silently ignored (fixes #809)
 
 #### Documentation
 
+* Documented the `context` option (fixes #809)
 * Documented using custom SVG icons without a gulp build step (fixes #762)
 * Added a dynamic per-row title example to the menu-title demo (fixes #769)
 * The asynchronous create demo now works on right click (fixes #735)
diff --git a/documentation/docs.md b/documentation/docs.md
index 82d23ecd..ccda927d 100644
--- a/documentation/docs.md
+++ b/documentation/docs.md
@@ -13,6 +13,7 @@ title: jQuery contextMenu — Documentation
 - [Update contextMenu state](#update-contextmenu-state)
 - [Options (at registration)](#options-at-registration)
   - [selector](#selector)
+  - [context](#context)
   - [items](#items)
   - [appendTo](#appendto)
   - [trigger](#trigger)
@@ -66,6 +67,37 @@ $.contextMenu({
 });
 ```
 
+### context
+
+Limits the registration to a single container element: only elements matching the [selector](#selector) inside that container trigger this menu. Elements matching the selector elsewhere on the page are left alone, so the same selector can be registered more than once with a different menu per container.
+
+`context`: `string`, `DOMElement` or `jQuery object` default: `document`
+
+A selector string is resolved against the document and its first match is used. When the context cannot be resolved to an element the menu is registered for the whole document, as if no context was given.
+
+#### Example
+```javascript
+// scope the menu to a container, selected with a selector string
+$.contextMenu({
+    selector: '.context-menu',
+    context: 'div#panel'
+});
+
+// scope the menu to a container, selected with a dom element
+var element = document.getElementById('panel');
+$.contextMenu({
+    selector: '.context-menu',
+    context: element
+});
+
+// scope the menu to a container, selected with a jQuery object.
+// $(container).contextMenu(options) is shorthand for this.
+$.contextMenu({
+    selector: '.context-menu',
+    context: $('#panel')
+});
+```
+
 ### items
 
 Object with [items](docs/items.html) to be listed in contextMenu. See [items](docs/items.html) for a full documentation on how to build your menu items.
diff --git a/src/jquery.contextMenu.js b/src/jquery.contextMenu.js
index 5f77c0d9..445751c2 100644
--- a/src/jquery.contextMenu.js
+++ b/src/jquery.contextMenu.js
@@ -2659,13 +2659,28 @@
         var useElementSelector = isElementSelector(o.selector);
         var $elements = useElementSelector ? (o.selector.jquery ? o.selector : $(o.selector)) : null;
 
-        if (!o.context || !o.context.length) {
-            o.context = document;
+        // `context` may be given as a selector string, an Element, a jQuery
+        // object or `document`. Whatever comes in, it is normalized here to a
+        // single DOM node: every other consumer of `o.context` treats it as a
+        // raw node (`o.context !== el`, `$.contains(o.context, el)`, ...).
+        //
+        // Note this deliberately does not look at `o.context.length`, which is
+        // what it used to do: a raw Element has no `length` at all and was
+        // therefore always dropped, while <form> and <select> elements do have
+        // one (their control/option count), so an empty one was dropped and a
+        // non-empty one accepted. A dropped context silently left the menu
+        // registered for the whole document instead of the given element.
+        // See https://github.com/swisnl/jQuery-contextMenu/issues/809
+        // you never know what they throw at you...
+        var contextNode = o.context ? resolveSelector(o.context).get(0) : null;
+
+        if (contextNode && (contextNode.nodeType === 1 || contextNode.nodeType === 9)) {
+            $context = $(contextNode);
+            o.context = contextNode;
+            _hasContext = !$context.is(document);
         } else {
-            // you never know what they throw at you...
-            $context = resolveSelector(o.context).first();
-            o.context = $context.get(0);
-            _hasContext = !$(o.context).is(document);
+            // nothing usable given, or it matched no element: register globally
+            o.context = document;
         }
 
         switch (operation) {
diff --git a/test/unit/issue-731-selector-html-injection.test.js b/test/unit/issue-731-selector-html-injection.test.js
index d95bc527..ff2ce6cd 100644
--- a/test/unit/issue-731-selector-html-injection.test.js
+++ b/test/unit/issue-731-selector-html-injection.test.js
@@ -153,17 +153,20 @@ QUnit.test('context may be a selector string', function(assert) {
   assert.equal(counter.shown, 1, 'a trigger inside the string context opens the menu');
 });
 
-// A raw Element has no `length`, so `!o.context.length` sends it down the "no
-// context" branch and it silently becomes `document` - the registration is not
-// scoped to the element at all. That is pre-existing behaviour, unrelated to
-// this change; all that is asserted here is that an Element context still
-// yields a working menu.
+// A raw Element used to be dropped here (it has no `length`, which is what the
+// old normalisation tested), leaving the registration bound to `document`
+// instead of scoped to the element. See
+// https://github.com/swisnl/jQuery-contextMenu/issues/809 for that fix and
+// test/unit/issue-809-context-element.test.js for its own coverage.
 QUnit.test('context may be an Element', function(assert) {
   var fixture = setupScopedFixture();
   var counter = {shown: 0};
 
   registerScopedMenu(fixture.$container.get(0), counter);
 
+  fixture.$outside.trigger($.Event('contextmenu'));
+  assert.equal(counter.shown, 0, 'a trigger outside the Element context is not handled');
+
   fixture.$inside.trigger($.Event('contextmenu'));
   assert.equal(counter.shown, 1, 'a trigger inside the Element context opens the menu');
 });
diff --git a/test/unit/issue-809-context-element.test.js b/test/unit/issue-809-context-element.test.js
new file mode 100644
index 00000000..b1c486c3
--- /dev/null
+++ b/test/unit/issue-809-context-element.test.js
@@ -0,0 +1,187 @@
+// Regression tests for https://github.com/swisnl/jQuery-contextMenu/issues/809
+//
+// The `context` option used to be normalized with `if (!o.context || !o.context.length)`,
+// which silently fell back to `document`:
+//  - a raw DOM Element has no `length` at all, so it was always dropped;
+//  - a <form>/<select> element does have a `length` (its control/option count),
+//    so an empty one was dropped while a non-empty one was accepted.
+// In every dropped case the registration ended up bound globally instead of
+// being scoped to the element the caller passed.
+
+// Wrapped in an IIFE: Karma loads every test file as a plain script into the
+// same global scope, so top-level helpers would collide across files.
+(function() {
+  'use strict';
+
+  function fixture() {
+    var $fixture = $('#qunit-fixture');
+    if ($fixture.length === 0) {
+      $fixture = $('<div id="qunit-fixture">').appendTo('body');
+    }
+    return $fixture;
+  }
+
+  QUnit.module('issue 809 - Element as the context option', {
+    afterEach: function() {
+      $.contextMenu('destroy');
+      fixture().html('');
+    }
+  });
+
+  // Registers a menu for '.ctx-item' scoped to `context` and returns a counter
+  // object tracking how many times the menu was shown.
+  function registerScopedMenu(context) {
+    var counter = {shown: 0};
+
+    $.contextMenu({
+      selector: '.ctx-item',
+      context: context,
+      events: {
+        show: function() {
+          counter.shown++;
+        }
+      },
+      items: {
+        copy: {name: 'Copy'}
+      }
+    });
+
+    return counter;
+  }
+
+  QUnit.test('a raw Element passed as context scopes the registration', function(assert) {
+    var $fixture = fixture();
+    $fixture.html(
+      '<div id="in-context"><span class="ctx-item" id="inside">inside</span></div>' +
+      '<span class="ctx-item" id="outside">outside</span>'
+    );
+
+    var counter = registerScopedMenu(document.getElementById('in-context'));
+
+    $('#outside').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 0, 'a trigger outside the context element does not open the menu');
+
+    $('#inside').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 1, 'a trigger inside the context element opens the menu');
+  });
+
+  QUnit.test('an empty <form> passed as context scopes the registration', function(assert) {
+    // An empty <form> has `length === 0` (no form controls), which the old
+    // truthiness check read as "no context given".
+    var $fixture = fixture();
+    $fixture.html(
+      '<form id="in-context"><span class="ctx-item" id="inside">inside</span></form>' +
+      '<span class="ctx-item" id="outside">outside</span>'
+    );
+
+    var form = document.getElementById('in-context');
+    assert.equal(form.length, 0, 'sanity check: the form reports length 0');
+
+    var counter = registerScopedMenu(form);
+
+    $('#outside').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 0, 'a trigger outside the empty form does not open the menu');
+
+    $('#inside').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 1, 'a trigger inside the empty form opens the menu');
+  });
+
+  QUnit.test('an empty <select> passed as context does not silently register globally', function(assert) {
+    // A <select> without <option>s reports length 0 as well. Nothing can trigger
+    // inside it, so the only thing that matters is that the registration is not
+    // quietly promoted to a document-wide one.
+    var $fixture = fixture();
+    $fixture.html(
+      '<select id="in-context"></select>' +
+      '<span class="ctx-item" id="outside">outside</span>'
+    );
+
+    var counter = registerScopedMenu(document.getElementById('in-context'));
+
+    $('#outside').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 0, 'a trigger outside the empty select does not open the menu');
+  });
+
+  QUnit.test('a jQuery object passed as context still scopes the registration', function(assert) {
+    var $fixture = fixture();
+    $fixture.html(
+      '<div id="in-context"><span class="ctx-item" id="inside">inside</span></div>' +
+      '<span class="ctx-item" id="outside">outside</span>'
+    );
+
+    var counter = registerScopedMenu($('#in-context'));
+
+    $('#outside').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 0, 'a trigger outside the context element does not open the menu');
+
+    $('#inside').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 1, 'a trigger inside the context element opens the menu');
+  });
+
+  QUnit.test('a selector string passed as context still scopes the registration', function(assert) {
+    var $fixture = fixture();
+    $fixture.html(
+      '<div id="in-context"><span class="ctx-item" id="inside">inside</span></div>' +
+      '<span class="ctx-item" id="outside">outside</span>'
+    );
+
+    var counter = registerScopedMenu('#in-context');
+
+    $('#outside').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 0, 'a trigger outside the context element does not open the menu');
+
+    $('#inside').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 1, 'a trigger inside the context element opens the menu');
+  });
+
+  QUnit.test('omitting context still registers against the whole document', function(assert) {
+    var $fixture = fixture();
+    $fixture.html('<span class="ctx-item" id="anywhere">anywhere</span>');
+
+    var counter = registerScopedMenu(undefined);
+
+    $('#anywhere').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 1, 'without a context the menu is registered document-wide');
+  });
+
+  QUnit.test('a context that resolves to nothing falls back to the document', function(assert) {
+    var $fixture = fixture();
+    $fixture.html('<span class="ctx-item" id="anywhere">anywhere</span>');
+
+    var counter = registerScopedMenu('#does-not-exist');
+
+    $('#anywhere').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 1, 'an unmatched context selector behaves as if no context was given');
+  });
+
+  QUnit.test('destroying by a raw Element context only removes the matching registration', function(assert) {
+    var $fixture = fixture();
+    $fixture.html(
+      '<span class="ctx-item" id="one">one</span>' +
+      '<span class="other-item" id="two">two</span>'
+    );
+
+    var shownOne = 0;
+    var shownTwo = 0;
+
+    $.contextMenu({
+      selector: '.ctx-item',
+      events: {show: function() { shownOne++; }},
+      items: {copy: {name: 'Copy'}}
+    });
+    $.contextMenu({
+      selector: '.other-item',
+      events: {show: function() { shownTwo++; }},
+      items: {copy: {name: 'Copy'}}
+    });
+
+    // Same thing as $('#one').contextMenu('destroy'), but with a raw Element.
+    $.contextMenu('destroy', {context: document.getElementById('one')});
+
+    $('#one').trigger($.Event('contextmenu'));
+    assert.equal(shownOne, 0, 'the registration matching the context element was destroyed');
+
+    $('#two').trigger($.Event('contextmenu'));
+    assert.equal(shownTwo, 1, 'the unrelated registration survived');
+  });
+})();

From ad68422563335e7b75158b8d0c02e9e1b73d2da4 Mon Sep 17 00:00:00 2001
From: bjorn <bjorn@swis.nl>
Date: Wed, 29 Jul 2026 21:28:26 +0200
Subject: [PATCH 2/2] fix: narrow the context fix to newly-accepted Element
 shapes only

Backwards compatibility review of the previous commit. Registering with a raw
Element context is the fix #809 asks for, but the same normalisation also
decides several shapes that are ignored *today*, and quietly honouring those
would un-scope menus that currently work - with no error, the menu simply stops
appearing outside the context element.

So the change is now strictly additive. Only an Element, and only for 'create',
takes the new branch; everything else keeps the legacy length test verbatim:

* <form>/<select> (and anything else with a numeric `length`, such as `window`)
  keep the old length-based decision, so an empty one is still ignored.
* A context selector matching nothing still registers nothing.
* 'destroy'/'update' still ignore an Element context. There `context` means the
  trigger element, not a container, and scoping it would turn a
  $.contextMenu('destroy', {context: element}) that tears everything down today
  into a silent no-op.

An ignored Element context also meant the menu was tracked in `namespaces`,
which is what lets $.contextMenu('destroy', selector) find it. Keep tracking it
so that teardown keeps working, and unbind from the menu's own context rather
than always from `document`, which is where the handler now lives.

The legacy cases are pinned by tests, and documented as deprecated.
---
 CHANGELOG.md                                |   2 +-
 documentation/docs.md                       |   7 +-
 src/jquery.contextMenu.js                   |  85 ++++++---
 test/unit/issue-809-context-element.test.js | 185 +++++++++++---------
 4 files changed, 174 insertions(+), 105 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 7b147397..9221ff9a 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -27,7 +27,7 @@
 * A `select`'s phantom mousedown is no longer treated as an outside click (fixes #744)
 * A re-dispatched layer click now targets the element actually clicked (fixes #771)
 * Guard against undefined `e.data` in the contextmenu handler (fixes #777)
-* A raw `Element` passed as `context` now scopes the registration instead of being silently ignored (fixes #809)
+* A raw `Element` passed as `context` now scopes the registration instead of being silently ignored (fixes #809). An empty `<form>`/`<select>` and a selector string matching nothing are still ignored, as they are today
 
 #### Documentation
 
diff --git a/documentation/docs.md b/documentation/docs.md
index ccda927d..0d5e0c04 100644
--- a/documentation/docs.md
+++ b/documentation/docs.md
@@ -73,7 +73,12 @@ Limits the registration to a single container element: only elements matching th
 
 `context`: `string`, `DOMElement` or `jQuery object` default: `document`
 
-A selector string is resolved against the document and its first match is used. When the context cannot be resolved to an element the menu is registered for the whole document, as if no context was given.
+A selector string is resolved against the document and its first match is used. A jQuery object matching nothing is treated as if no context was given, and the menu is registered for the whole document.
+
+Two shapes are ignored for historical reasons, and the menu is registered for the whole document instead. Both will start scoping in a future major release, so do not rely on them:
+
+* a `<form>` or `<select>` element with no controls or options in it, because such an element reports a length of `0`,
+* a selector string matching no element, which registers nothing at all.
 
 #### Example
 ```javascript
diff --git a/src/jquery.contextMenu.js b/src/jquery.contextMenu.js
index 445751c2..bbf56f40 100644
--- a/src/jquery.contextMenu.js
+++ b/src/jquery.contextMenu.js
@@ -2652,6 +2652,11 @@
         var $document = $(document);
         var $context = $document;
         var _hasContext = false;
+        // was `context` given as a raw Element? Those used to be ignored, which
+        // means they were also tracked in `namespaces` - see the 'create'
+        // operation, which keeps doing that so destroy-by-selector keeps
+        // working for them.
+        var _contextFromElement = false;
 
         // an Element / jQuery object can't be used as a delegated-event
         // selector string, so it's normalized here once and handled
@@ -2660,27 +2665,44 @@
         var $elements = useElementSelector ? (o.selector.jquery ? o.selector : $(o.selector)) : null;
 
         // `context` may be given as a selector string, an Element, a jQuery
-        // object or `document`. Whatever comes in, it is normalized here to a
-        // single DOM node: every other consumer of `o.context` treats it as a
-        // raw node (`o.context !== el`, `$.contains(o.context, el)`, ...).
+        // object or `document`, and is normalized here to a single DOM node:
+        // every consumer of `o.context` treats it as a raw node
+        // (`o.context !== el`, `$.contains(o.context, el)`, ...).
         //
-        // Note this deliberately does not look at `o.context.length`, which is
-        // what it used to do: a raw Element has no `length` at all and was
-        // therefore always dropped, while <form> and <select> elements do have
-        // one (their control/option count), so an empty one was dropped and a
-        // non-empty one accepted. A dropped context silently left the menu
-        // registered for the whole document instead of the given element.
+        // A raw Element used to be dropped by the `!o.context.length` test
+        // below - an Element has no `length` at all - which silently left the
+        // menu registered for the whole document instead of scoped to the
+        // element the caller passed. That is what is fixed here.
         // See https://github.com/swisnl/jQuery-contextMenu/issues/809
-        // you never know what they throw at you...
-        var contextNode = o.context ? resolveSelector(o.context).get(0) : null;
-
-        if (contextNode && (contextNode.nodeType === 1 || contextNode.nodeType === 9)) {
-            $context = $(contextNode);
-            o.context = contextNode;
-            _hasContext = !$context.is(document);
-        } else {
-            // nothing usable given, or it matched no element: register globally
+        //
+        // Everything else is left exactly as it was, on purpose. Newly
+        // honouring a context that is ignored today un-scopes menus that work
+        // today, silently and without an error, so it is a breaking change and
+        // belongs in a major release:
+        //  - values carrying a numeric `length` keep the legacy length test.
+        //    That covers <form> and <select> (whose `length` is their
+        //    control/option count, so an empty one is still ignored) and
+        //    `window` (its frame count), as well as strings and jQuery objects.
+        //  - only 'create' honours an Element. For 'destroy' and 'update',
+        //    `context` means the *trigger* element rather than a container -
+        //    that is what `$.fn.contextMenu('destroy')` passes - and an Element
+        //    has never been accepted there. Scoping those too would turn a
+        //    `$.contextMenu('destroy', {context: element})` that tears
+        //    everything down today into a silent no-op.
+        if (!o.context) {
             o.context = document;
+        } else if (operation === 'create' && o.context.nodeType === 1 && typeof o.context.length !== 'number') {
+            $context = $(o.context);
+            // an element is never the document, so this is always a real scope
+            _hasContext = true;
+            _contextFromElement = true;
+        } else if (!o.context.length) {
+            o.context = document;
+        } else {
+            // you never know what they throw at you...
+            $context = resolveSelector(o.context).first();
+            o.context = $context.get(0);
+            _hasContext = !$(o.context).is(document);
         }
 
         switch (operation) {
@@ -2735,7 +2757,13 @@
                     $elements.each(function () {
                         elementSelectors.push({el: this, ns: o.ns});
                     });
-                } else if (!_hasContext) {
+                } else if (!_hasContext || _contextFromElement) {
+                    // An Element `context` used to be ignored, so the menu was
+                    // registered globally *and* tracked here, which is what
+                    // makes `$.contextMenu('destroy', selector)` able to find
+                    // it. Keep tracking it now that the context is honoured,
+                    // otherwise that teardown call would silently stop working.
+                    // See https://github.com/swisnl/jQuery-contextMenu/issues/809
                     namespaces[o.selector] = o.ns;
                 }
                 menus[o.ns] = o;
@@ -2925,23 +2953,30 @@
                         }
                     });
                 } else if (namespaces[o.selector]) {
+                    var selectorNs = namespaces[o.selector];
+                    // the handler lives on the menu's own context, which is
+                    // `document` for a global registration but the element
+                    // itself when the menu was registered with an Element
+                    // context (see the 'create' operation)
+                    var selectorNsContext = (menus[selectorNs] && menus[selectorNs].context) || document;
+
                     $visibleMenu = $('.context-menu-list').filter(':visible');
                     if ($visibleMenu.length && $visibleMenu.data().contextMenuRoot.$trigger.is(o.selector)) {
                         $visibleMenu.trigger('contextmenu:hide', {force: true});
                     }
 
                     try {
-                        if (menus[namespaces[o.selector]].$menu) {
-                            menus[namespaces[o.selector]].$menu.remove();
+                        if (menus[selectorNs].$menu) {
+                            menus[selectorNs].$menu.remove();
                         }
 
-                        delete menus[namespaces[o.selector]];
-                        delete builtMenus[namespaces[o.selector]];
+                        delete menus[selectorNs];
+                        delete builtMenus[selectorNs];
                     } catch (e) {
-                        menus[namespaces[o.selector]] = null;
+                        menus[selectorNs] = null;
                     }
 
-                    $document.off(namespaces[o.selector]);
+                    $(selectorNsContext).off(selectorNs);
                 }
                 break;
 
diff --git a/test/unit/issue-809-context-element.test.js b/test/unit/issue-809-context-element.test.js
index b1c486c3..a3259bef 100644
--- a/test/unit/issue-809-context-element.test.js
+++ b/test/unit/issue-809-context-element.test.js
@@ -1,12 +1,16 @@
 // Regression tests for https://github.com/swisnl/jQuery-contextMenu/issues/809
 //
-// The `context` option used to be normalized with `if (!o.context || !o.context.length)`,
-// which silently fell back to `document`:
-//  - a raw DOM Element has no `length` at all, so it was always dropped;
-//  - a <form>/<select> element does have a `length` (its control/option count),
-//    so an empty one was dropped while a non-empty one was accepted.
-// In every dropped case the registration ended up bound globally instead of
-// being scoped to the element the caller passed.
+// `context` was normalized with `if (!o.context || !o.context.length)`, a test
+// only jQuery objects and strings answer meaningfully. A raw DOM Element has no
+// `length` at all, so it was dropped and the registration silently fell back to
+// `document`: the menu worked, but page-wide instead of scoped to the element
+// that was passed.
+//
+// Registering with an Element context is fixed here. The other shapes that
+// check misjudges are deliberately left as they are, because newly honouring a
+// context that is ignored today would silently un-scope menus that work today.
+// Those cases are pinned below as "legacy behaviour, deliberately unchanged" so
+// the compromise is visible rather than accidental.
 
 // Wrapped in an IIFE: Karma loads every test file as a plain script into the
 // same global scope, so top-level helpers would collide across files.
@@ -49,14 +53,20 @@
     return counter;
   }
 
-  QUnit.test('a raw Element passed as context scopes the registration', function(assert) {
-    var $fixture = fixture();
-    $fixture.html(
-      '<div id="in-context"><span class="ctx-item" id="inside">inside</span></div>' +
+  // One trigger inside a container, one identical trigger outside it.
+  function setupScopedFixture(containerHtml) {
+    fixture().html(
+      containerHtml.replace('{{trigger}}', '<span class="ctx-item" id="inside">inside</span>') +
       '<span class="ctx-item" id="outside">outside</span>'
     );
 
-    var counter = registerScopedMenu(document.getElementById('in-context'));
+    return document.getElementById('in-context');
+  }
+
+  QUnit.test('a raw Element passed as context scopes the registration', function(assert) {
+    var container = setupScopedFixture('<div id="in-context">{{trigger}}</div>');
+
+    var counter = registerScopedMenu(container);
 
     $('#outside').trigger($.Event('contextmenu'));
     assert.equal(counter.shown, 0, 'a trigger outside the context element does not open the menu');
@@ -65,49 +75,26 @@
     assert.equal(counter.shown, 1, 'a trigger inside the context element opens the menu');
   });
 
-  QUnit.test('an empty <form> passed as context scopes the registration', function(assert) {
-    // An empty <form> has `length === 0` (no form controls), which the old
-    // truthiness check read as "no context given".
-    var $fixture = fixture();
-    $fixture.html(
-      '<form id="in-context"><span class="ctx-item" id="inside">inside</span></form>' +
-      '<span class="ctx-item" id="outside">outside</span>'
-    );
-
-    var form = document.getElementById('in-context');
-    assert.equal(form.length, 0, 'sanity check: the form reports length 0');
-
-    var counter = registerScopedMenu(form);
+  QUnit.test('a menu registered with an Element context can still be destroyed by selector', function(assert) {
+    // An ignored Element context meant the menu was registered globally, and
+    // global registrations are the ones `$.contextMenu('destroy', selector)`
+    // can find. Honouring the context must not take that away.
+    var container = setupScopedFixture('<div id="in-context">{{trigger}}</div>');
 
-    $('#outside').trigger($.Event('contextmenu'));
-    assert.equal(counter.shown, 0, 'a trigger outside the empty form does not open the menu');
+    var counter = registerScopedMenu(container);
 
     $('#inside').trigger($.Event('contextmenu'));
-    assert.equal(counter.shown, 1, 'a trigger inside the empty form opens the menu');
-  });
+    assert.equal(counter.shown, 1, 'sanity check: the menu opens before being destroyed');
 
-  QUnit.test('an empty <select> passed as context does not silently register globally', function(assert) {
-    // A <select> without <option>s reports length 0 as well. Nothing can trigger
-    // inside it, so the only thing that matters is that the registration is not
-    // quietly promoted to a document-wide one.
-    var $fixture = fixture();
-    $fixture.html(
-      '<select id="in-context"></select>' +
-      '<span class="ctx-item" id="outside">outside</span>'
-    );
-
-    var counter = registerScopedMenu(document.getElementById('in-context'));
+    $.contextMenu('destroy', '.ctx-item');
 
-    $('#outside').trigger($.Event('contextmenu'));
-    assert.equal(counter.shown, 0, 'a trigger outside the empty select does not open the menu');
+    counter.shown = 0;
+    $('#inside').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 0, 'the menu no longer opens after destroy-by-selector');
   });
 
   QUnit.test('a jQuery object passed as context still scopes the registration', function(assert) {
-    var $fixture = fixture();
-    $fixture.html(
-      '<div id="in-context"><span class="ctx-item" id="inside">inside</span></div>' +
-      '<span class="ctx-item" id="outside">outside</span>'
-    );
+    setupScopedFixture('<div id="in-context">{{trigger}}</div>');
 
     var counter = registerScopedMenu($('#in-context'));
 
@@ -119,11 +106,7 @@
   });
 
   QUnit.test('a selector string passed as context still scopes the registration', function(assert) {
-    var $fixture = fixture();
-    $fixture.html(
-      '<div id="in-context"><span class="ctx-item" id="inside">inside</span></div>' +
-      '<span class="ctx-item" id="outside">outside</span>'
-    );
+    setupScopedFixture('<div id="in-context">{{trigger}}</div>');
 
     var counter = registerScopedMenu('#in-context');
 
@@ -135,8 +118,7 @@
   });
 
   QUnit.test('omitting context still registers against the whole document', function(assert) {
-    var $fixture = fixture();
-    $fixture.html('<span class="ctx-item" id="anywhere">anywhere</span>');
+    fixture().html('<span class="ctx-item" id="anywhere">anywhere</span>');
 
     var counter = registerScopedMenu(undefined);
 
@@ -144,44 +126,91 @@
     assert.equal(counter.shown, 1, 'without a context the menu is registered document-wide');
   });
 
-  QUnit.test('a context that resolves to nothing falls back to the document', function(assert) {
-    var $fixture = fixture();
-    $fixture.html('<span class="ctx-item" id="anywhere">anywhere</span>');
+  QUnit.test('a non-empty <form> passed as context still scopes the registration', function(assert) {
+    // A <form> carries a `length` of its own (its control count), so a
+    // non-empty one has always been accepted as a context.
+    var form = setupScopedFixture('<form id="in-context"><input name="a">{{trigger}}</form>');
+    assert.ok(form.length > 0, 'sanity check: the form reports a non-zero length');
+
+    var counter = registerScopedMenu(form);
+
+    $('#outside').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 0, 'a trigger outside the form does not open the menu');
+
+    $('#inside').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 1, 'a trigger inside the form opens the menu');
+  });
+
+  // --- legacy behaviour, deliberately unchanged -----------------------------
+  //
+  // Everything below pins down a context that is *ignored* today. Honouring it
+  // would scope menus that are registered page-wide today, which stops them
+  // firing outside the context element with no error to explain why. That is a
+  // breaking change for working integrations, so it is out of scope for a
+  // patch release. See the pull request for #809.
+
+  QUnit.test('an empty <form> passed as context is still ignored (legacy)', function(assert) {
+    // An empty <form> reports `length === 0`, which the length test reads as
+    // "no context given".
+    var form = setupScopedFixture('<form id="in-context">{{trigger}}</form>');
+    assert.equal(form.length, 0, 'sanity check: the form reports length 0');
+
+    var counter = registerScopedMenu(form);
+
+    $('#inside').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 1, 'a trigger inside the empty form opens the menu');
+
+    counter.shown = 0;
+    $('#outside').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 1, 'the registration is still document-wide, as it is today');
+  });
+
+  QUnit.test('an empty <select> passed as context is still ignored (legacy)', function(assert) {
+    fixture().html(
+      '<select id="in-context"></select>' +
+      '<span class="ctx-item" id="outside">outside</span>'
+    );
+
+    var counter = registerScopedMenu(document.getElementById('in-context'));
+
+    $('#outside').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 1, 'the registration is still document-wide, as it is today');
+  });
+
+  QUnit.test('a context selector matching nothing still registers nothing (legacy)', function(assert) {
+    fixture().html('<span class="ctx-item" id="anywhere">anywhere</span>');
 
     var counter = registerScopedMenu('#does-not-exist');
 
     $('#anywhere').trigger($.Event('contextmenu'));
-    assert.equal(counter.shown, 1, 'an unmatched context selector behaves as if no context was given');
+    assert.equal(counter.shown, 0, 'the menu is bound to nothing at all, as it is today');
   });
 
-  QUnit.test('destroying by a raw Element context only removes the matching registration', function(assert) {
-    var $fixture = fixture();
-    $fixture.html(
-      '<span class="ctx-item" id="one">one</span>' +
-      '<span class="other-item" id="two">two</span>'
+  QUnit.test('destroy with an Element context still tears everything down (legacy)', function(assert) {
+    // For 'destroy', `context` means the trigger element rather than a
+    // container - that is what $.fn.contextMenu('destroy') passes - and a raw
+    // Element has never been accepted there: it falls through to the "no
+    // context, no selector" branch, which destroys every registered menu.
+    // Scoping it would silently turn this call into a no-op.
+    fixture().html(
+      '<div id="in-context"><span class="ctx-item" id="inside">inside</span></div>' +
+      '<span class="other-item" id="other">other</span>'
     );
 
-    var shownOne = 0;
-    var shownTwo = 0;
-
-    $.contextMenu({
-      selector: '.ctx-item',
-      events: {show: function() { shownOne++; }},
-      items: {copy: {name: 'Copy'}}
-    });
+    var counter = registerScopedMenu(document.getElementById('in-context'));
+    var otherShown = 0;
     $.contextMenu({
       selector: '.other-item',
-      events: {show: function() { shownTwo++; }},
+      events: {show: function() { otherShown++; }},
       items: {copy: {name: 'Copy'}}
     });
 
-    // Same thing as $('#one').contextMenu('destroy'), but with a raw Element.
-    $.contextMenu('destroy', {context: document.getElementById('one')});
+    $.contextMenu('destroy', {context: document.getElementById('in-context')});
 
-    $('#one').trigger($.Event('contextmenu'));
-    assert.equal(shownOne, 0, 'the registration matching the context element was destroyed');
+    $('#inside').trigger($.Event('contextmenu'));
+    assert.equal(counter.shown, 0, 'the Element-scoped menu was destroyed');
 
-    $('#two').trigger($.Event('contextmenu'));
-    assert.equal(shownTwo, 1, 'the unrelated registration survived');
+    $('#other').trigger($.Event('contextmenu'));
+    assert.equal(otherShown, 0, 'the unrelated menu was destroyed as well, as it is today');
   });
 })();