feat(glean): port missing measurements

[caugner]

Description

Adds several missing Glean measurements, and corrects some.

Motivation

Ensure we can make data-driven decisions about the affected features.

Additional details

Related issues and pull requests

Related to #647.

Fixes several issues, mentioned directly in the commits.

[github-actions]

ce08a77 was deployed to: https://fred-pr1279.review.mdn.allizom.net/

[caugner]

Reviewed all changes, will test next.

[caugner]

Glean Measurement Testing Checklist

Setup: Enable Glean by setting FRED_GLEAN_ENABLED=true in .env and monitor gleanClick() calls in the browser console (e.g. breakpoint in hooks/glean-init.js).

Accessibility Menu (a11y-menu)

• Tab into the a11y menu and click "Skip to main content" — fires a11y_menu: click #content
• Tab into the a11y menu and click "Skip to search" — fires a11y_menu: click #search

Theme Switcher (color-theme)

• Open the theme dropdown — fires theme_switcher: open
• Close the theme dropdown without changing — fires theme_switcher: close
• Switch to dark theme — fires theme_switcher: switch -> dark
• Switch to light theme — fires theme_switcher: switch -> light
• Switch to OS default — fires theme_switcher: switch -> os-default

Menu Bar (menu)

• Click each top-level menu dropdown (e.g. References, Guides) — fires menu_toggle: <tab-id> for each

Login (login-button, user-menu)

• Click login button in top nav (logged-out state) — fires top_nav: login
• Click login button elsewhere — fires login_button

Breadcrumbs (breadcrumbs)

• Click a breadcrumb link — fires breadcrumb_click: <position>/<total> (e.g. 2/3)

Table of Contents (generic-toc, reference-toc)

• Click a TOC link on an article page — fires toc_click: #<id>
• Click a TOC link on a reference page — fires toc_click: #<id>

Sidebar (sidebar-filter, hooks/glean-init.js)

• Focus the sidebar filter input — fires sidebar_filter_focus
• Type into the sidebar filter — fires sidebar_filter_typed (once, on first non-empty input)
• Click any link in the left sidebar — fires sidebar_click: sidebar <href>

Footer (footer)

• Click a social media icon (e.g. GitHub) — fires footer: social -> <icon>
• Click a footer section link — fires footer: link -> <href>
• Click a Mozilla-related footer link — fires footer: mozilla -> <href>

Language Switcher (language-switcher, language-always-redirect-button, translation-banner)

• On a translated page, click a language link — fires language: <from> -> <to>
• Toggle "remember preference" on — fires language_remember: <old> -> <locale>
• Toggle "remember preference" off — fires language_remember: <old> -> 0
• Click "Always redirect" button — fires language: <from> -> <to> (always)
• Click "View in English" on translation banner — fires language: <locale> -> en-US (view)

Homepage (featured-articles, latest-news, recent-contributions)

• Click a featured article tag — fires homepage: article_tag <n>
• Click a featured article title — fires homepage: article <n>
• Click a news source link — fires homepage: news_source <n>
• Click a news item title — fires homepage: news <n>
• Click a recent contribution link — fires homepage: contribution <n>

About Tabs (about-tabs)

• Navigate to an About page and click a tab — fires about: tab -> <panel-id>

Playground (playground)

• Click the Share button — fires playground: share-click
• Click Reset and confirm — fires playground: reset-click
• In share modal, click "Copy as Markdown" — fires playground: share-markdown
• In share modal, click "Create permalink" — fires playground: share-permalink
• Click the Report/Flag button — fires playground: flag-click
• Click Login from share modal (logged-out state) — fires playground: banner-login

Collections (collection-save-button)

• Click Save to Collection — fires article_actions_collections_opened
• Open the collection select dropdown — fires article_actions_collection_select_opened
• Select "Add new collection" — fires article_actions_new_collection
• Submit saving to a collection — fires new_collection_modal_submit_article_actions

Observatory (observatory-form, observatory-results, observatory-results/rating)

• Submit a scan — fires observatory: scan
• Trigger a scan error — fires observatory: error -> <message>
• Click Rescan — fires observatory: rescan
• Click a results tab — fires observatory: tab -> <key>
• Click "Scan another website" — fires observatory: scan-another
• Trigger API failure for scan results — fires observatory: error -> Observatory API request for scan data failed

View/Impression Measurements (scroll into viewport, fires once)

• Scroll a BCD table into view — fires bcd: view -> <query>
• Scroll Scrimba placement banner into view — fires banner_scrimba_view
• Scroll a Scrim inline embed into view — fires curriculum: scrim view id:<scrim-id>
• Scroll curriculum partner banner into view — fires curriculum: partner banner view
• Verify view measurements only fire once per element (scroll away and back)

Infrastructure (hooks/glean-init.js)

• Verify data-glean-id attribute works on click
• Verify data-glean-toggle-open fires only when a <details> element opens (not on close)
• Verify data-glean-view fires once when element scrolls into 50% visibility
• Verify external link clicks still fire external-link: <href>

[caugner]

• Close the theme dropdown without changing — fires theme_switcher: close

🐛 Also fires when selecting an item.
🔥 Fires on page load.

• Click each top-level menu dropdown (e.g. References, Guides) — fires menu_toggle: <tab-id> for each

🐛 Fires both on open and close.

• Click login button in top nav (logged-out state) — fires top_nav: login
• Click login button elsewhere — fires login_button

🐛 No event observed (maybe because the data-glean-id is on the mdn-button, not on the a inside).

• Click "Always redirect" button — fires language: <from> -> <to> (always)

• Click "View in English" on translation banner — fires language: <locale> -> en-US (view)

Need to test locally.

• Click a news source link — fires homepage: news_source <n>

• Click a news item title — fires homepage: news <n>

Need to test locally.

• Click Reset and confirm — fires playground: reset-click

🐛 No event.

• Open the collection select dropdown — fires article_actions_collection_select_opened

🐛 Fires when item is selected, not when the select is opened.

• Scroll a Scrim inline embed into view — fires curriculum: scrim view id:<scrim-id>

Need to test locally.