From 9023fc7119a9cb2520ef54186fc0c633c1f33a85 Mon Sep 17 00:00:00 2001
From: Tobias Bieniek <tobias@bieniek.cloud>
Date: Wed, 17 Sep 2025 15:13:39 +0200
Subject: [PATCH 1/2] settings/tokens: Add scope formatting tests

---
 e2e/routes/settings/tokens/index.spec.ts   | 25 ++++++++++++++++++++++
 tests/routes/settings/tokens/index-test.js | 16 ++++++++++++++
 2 files changed, 41 insertions(+)

diff --git a/e2e/routes/settings/tokens/index.spec.ts b/e2e/routes/settings/tokens/index.spec.ts
index 63661616294..bc0e0579e2e 100644
--- a/e2e/routes/settings/tokens/index.spec.ts
+++ b/e2e/routes/settings/tokens/index.spec.ts
@@ -28,4 +28,29 @@ test.describe('/settings/tokens', { tag: '@routes' }, () => {
     await expect(tokens[1].locator('[data-test-name]')).toHaveText('token-1');
     await expect(tokens[1].locator('[data-test-token]')).toHaveCount(0);
   });
+
+  test('scope formatting', async ({ page, msw }) => {
+    let user = msw.db.user.create({
+      login: 'johnnydee',
+      name: 'John Doe',
+      email: 'john@doe.com',
+      avatar: 'https://avatars2.githubusercontent.com/u/1234567?v=4',
+    });
+
+    await msw.authenticateAs(user);
+
+    msw.db.apiToken.create({
+      user,
+      endpointScopes: ['publish-new', 'publish-update', 'yank'],
+      crateScopes: ['serde', 'serde-*', 'serde_*'],
+    });
+
+    await page.goto('/settings/tokens');
+    await expect(page).toHaveURL('/settings/tokens');
+    await expect(page.locator('[data-test-api-token]')).toHaveCount(1);
+    await expect(page.locator('[data-test-endpoint-scopes]')).toHaveText(
+      'Scopes: publish-new , publish-update , and yank',
+    );
+    await expect(page.locator('[data-test-crate-scopes]')).toHaveText('Crates: serde , serde-* , and serde_*');
+  });
 });
diff --git a/tests/routes/settings/tokens/index-test.js b/tests/routes/settings/tokens/index-test.js
index 25d29c56a01..ac95c0c822e 100644
--- a/tests/routes/settings/tokens/index-test.js
+++ b/tests/routes/settings/tokens/index-test.js
@@ -41,4 +41,20 @@ module('/settings/tokens', function (hooks) {
     assert.dom('[data-test-name]', tokens[1]).hasText('token-1');
     assert.dom('[data-test-token]', tokens[1]).doesNotExist();
   });
+
+  test('scope formatting', async function (assert) {
+    let { user } = prepare(this);
+
+    this.db.apiToken.create({
+      user,
+      endpointScopes: ['publish-new', 'publish-update', 'yank'],
+      crateScopes: ['serde', 'serde-*', 'serde_*'],
+    });
+
+    await visit('/settings/tokens');
+    assert.strictEqual(currentURL(), '/settings/tokens');
+    assert.dom('[data-test-api-token]').exists({ count: 1 });
+    assert.dom('[data-test-endpoint-scopes]').hasText('Scopes: publish-new , publish-update , and yank');
+    assert.dom('[data-test-crate-scopes]').hasText('Crates: serde , serde-* , and serde_*');
+  });
 });

From 2abd0705676eab158c8aa61599ea901e57c87db9 Mon Sep 17 00:00:00 2001
From: Tobias Bieniek <tobias@bieniek.cloud>
Date: Wed, 17 Sep 2025 15:05:15 +0200
Subject: [PATCH 2/2] components/tooltip: Remove unintentional whitespace
 elements

---
 app/components/tooltip.gjs                 | 6 ++++--
 e2e/routes/settings/tokens/index.spec.ts   | 4 ++--
 tests/routes/settings/tokens/index-test.js | 4 ++--
 3 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/app/components/tooltip.gjs b/app/components/tooltip.gjs
index ecb54e6e232..b3548546a31 100644
--- a/app/components/tooltip.gjs
+++ b/app/components/tooltip.gjs
@@ -64,10 +64,12 @@ export default class Tooltip extends Component {
     return () => cleanup();
   });
 
+  // The `{{~@x~}}` is used for whitespace control to ensure we don't insert a leading whitespace element
   <template>
+    {{~@x~}}
     <span class='anchor' {{this.onInsertAnchor this}} />
 
-    {{#if this.visible}}
+    {{~#if this.visible}}
       {{#in-element this.containerElement}}
         <div class='tooltip' ...attributes {{this.attachTooltip this side=@side}}>
           {{#if (has-block)}}
@@ -77,6 +79,6 @@ export default class Tooltip extends Component {
           {{/if}}
         </div>
       {{/in-element}}
-    {{/if}}
+    {{/if~}}
   </template>
 }
diff --git a/e2e/routes/settings/tokens/index.spec.ts b/e2e/routes/settings/tokens/index.spec.ts
index bc0e0579e2e..51667fb0691 100644
--- a/e2e/routes/settings/tokens/index.spec.ts
+++ b/e2e/routes/settings/tokens/index.spec.ts
@@ -49,8 +49,8 @@ test.describe('/settings/tokens', { tag: '@routes' }, () => {
     await expect(page).toHaveURL('/settings/tokens');
     await expect(page.locator('[data-test-api-token]')).toHaveCount(1);
     await expect(page.locator('[data-test-endpoint-scopes]')).toHaveText(
-      'Scopes: publish-new , publish-update , and yank',
+      'Scopes: publish-new, publish-update, and yank',
     );
-    await expect(page.locator('[data-test-crate-scopes]')).toHaveText('Crates: serde , serde-* , and serde_*');
+    await expect(page.locator('[data-test-crate-scopes]')).toHaveText('Crates: serde, serde-*, and serde_*');
   });
 });
diff --git a/tests/routes/settings/tokens/index-test.js b/tests/routes/settings/tokens/index-test.js
index ac95c0c822e..0e17c79da6e 100644
--- a/tests/routes/settings/tokens/index-test.js
+++ b/tests/routes/settings/tokens/index-test.js
@@ -54,7 +54,7 @@ module('/settings/tokens', function (hooks) {
     await visit('/settings/tokens');
     assert.strictEqual(currentURL(), '/settings/tokens');
     assert.dom('[data-test-api-token]').exists({ count: 1 });
-    assert.dom('[data-test-endpoint-scopes]').hasText('Scopes: publish-new , publish-update , and yank');
-    assert.dom('[data-test-crate-scopes]').hasText('Crates: serde , serde-* , and serde_*');
+    assert.dom('[data-test-endpoint-scopes]').hasText('Scopes: publish-new, publish-update, and yank');
+    assert.dom('[data-test-crate-scopes]').hasText('Crates: serde, serde-*, and serde_*');
   });
 });