GA4 (gtag.js) SPA – custom events overwrite virtual page params with homepage unless I pass page_*. How to persist page context?

I have a single-page app. I send virtual pageviews on route change via gtag.js. On each client-side route change I do (for example):

  document.querySelector('.button-news').addEventListener('click', function() {
    console.log(">>> Registering news...")
    gtag('event', 'page_view', {
      page_title: 'Data Display',
      page_location: origin + '/data-display',
      page_path: '/data-display'
    });
  });

Later on the same route I send a custom UI event (e.g., button click) without page params:

  document.querySelector('#app-picker-picker').addEventListener('click', function() {
    console.log(">>> Registering button click: Select data")
    gtag('event', 'buttons', {
      buttons: "Select data"
    });
  });

Problem

As soon as the custom event fires, GA4 (DebugView/standard reports) shows that event under the homepage / (or the app root), not under the current virtual path (/data-display). It looks like GA4 “reverts” the page context to the real browser URL (or root) for events that don’t include page_*. In effect, my virtual pageview context is lost for subsequent events.

What I expected

Events that don’t explicitly set page_* would inherit the latest virtual page parameters until the next route change.

Questions

• What is the recommended pattern in GA4 + gtag.js for SPAs so that subsequent custom events inherit the current virtual page context? Manual entry with every custom event is not entirely optimal.
• Is there a supported way to set default event parameters for page_path, page_title, page_location that persist until I change them on the next route change (similar to UA’s gtag('set', 'page_path', ...) behavior)?
• Or is the only reliable approach to include page_* on every custom event?