Fix debug modal options missing for the mbgljs renderer (#2293)

Fixes #1548

The Debug modal only listed the map options for `mlgljs`, so an `mbgljs`
style got an empty "Options". It now checks `renderer !== "ol"`, as
suggested in the issue, which is how `App.tsx` picks the map anyway.

## Launch Checklist

 - [x] Briefly describe the changes in this PR.
 - [x] Link to related issues.
- [x] Include before/after visuals or gifs if this PR includes visual
changes.
 - [x] Write tests for all new functionality.
 - [x] Add an entry to `CHANGELOG.md` under the `## main` section.

Added an e2e case with a small `mbgljs` fixture.

## Video

Debug modal for an `mbgljs` style on this branch:


https://github.com/user-attachments/assets/41a7bc71-85cf-44ae-a56e-91af7fbb3904

Fix written with Claude Code; video is an automated browser run of this
branch recorded by User Stories Bot.

CHANGELOG.md

@@ -18,6 +18,7 @@
 - The `maputnik` desktop binary now opens the default browser automatically on startup (opt out with `--no-browser`)
 - Keyboard shortcuts now keep working while the map has focus, instead of going dead until the map is blurred
 - The map no longer stays blank on load until it is moved, when the style loads before the map is ready
+- The debug modal now shows the MapLibre options for any renderer other than OpenLayers (e.g. `mbgljs`)
 - _...Add new stuff here..._
 
 ## 3.1.0

e2e/fixtures/example-style-with-mbgljs-renderer.json

@@ -0,0 +1,10 @@
+{
+    "id": "test-style",
+    "version": 8,
+    "name": "Test Style",
+    "metadata": {
+        "maputnik:renderer": "mbgljs"
+    },
+    "sources": {},
+    "layers": []
+}

e2e/maputnik-driver.ts

@@ -41,6 +41,7 @@ export class MaputnikDriver {
         "example-style-with-zoom-5-and-center-50-50.json",
         "access-token-style.json",
         "grouped-layers-style.json",
+        "example-style-with-mbgljs-renderer.json",
       ];
       for (const fixture of styleFixtures) {
         await this.helper.given.interceptAndMockResponse({
@@ -93,6 +94,7 @@ export class MaputnikDriver {
         | "zoom_7_center_0_51"
         | "access_tokens"
         | "grouped_layers"
+        | "mbgljs_renderer"
         | "",
       zoom?: number
     ) => {
@@ -106,6 +108,7 @@ export class MaputnikDriver {
         zoom_7_center_0_51: "example-style-with-zoom-7-and-center-0-51.json",
         access_tokens: "access-token-style.json",
         grouped_layers: "grouped-layers-style.json",
+        mbgljs_renderer: "example-style-with-mbgljs-renderer.json",
       };
 
       const url = new URL(baseUrl);

e2e/modals.spec.ts

@@ -88,6 +88,14 @@ describe("modals", () => {
     });
   });
 
+  describe("debug with a renderer other than mlgljs or ol", () => {
+    test("shows the map options", async () => {
+      await when.setStyle("mbgljs_renderer");
+      await when.typeKeys("!");
+      await then(get.elementByTestId("modal:debug.max-zoom")).shouldBeVisible();
+    });
+  });
+
   describe("export", () => {
     beforeEach(async () => {
       await when.click("nav:export");

src/components/modals/ModalDebug.tsx

@@ -50,7 +50,7 @@ class ModalDebugInternal extends React.Component<ModalDebugInternalProps> {
     >
       <section className="maputnik-modal-section maputnik-modal-shortcuts">
         <h1>{t("Options")}</h1>
-        {this.props.renderer === "mlgljs" &&
+        {this.props.renderer !== "ol" &&
           <>
             <ul>
               {Object.entries(this.props.maplibreGlDebugOptions!).filter((entry): entry is [string, boolean] => typeof entry[1] === "boolean").map(([key, val]) => {