如何程序化检测浏览器对提案中`_split`窗口目标的支持？

Great question! Since the Split Screen API's _split target is still relatively new, there's no explicit, standardized feature flag exposed via navigator or window properties yet. However, we can use a practical, heuristic-based test to determine if the browser recognizes _split as a split-screen trigger rather than a regular named window.

Core Detection Method #

The key insight is that browsers supporting the _split target will attach a unique property (isSplitPane) to the window opened with this target. We can leverage this to build a detection function:

async function supportsSplitScreenTarget() {
  // Open a temporary blank window using the _split target
  const tempSplitWindow = window.open('about:blank', '_split');

  // Handle cases where popups are blocked (can't test support reliably)
  if (!tempSplitWindow) {
    console.warn("Popup blocked; can't verify split screen support");
    return false;
  }

  // Give the browser a brief moment to initialize the split pane
  await new Promise(resolve => setTimeout(resolve, 100));

  // Check if the window has the isSplitPane property (Edge's split screen indicator)
  const isSupported = !!tempSplitWindow.isSplitPane;

  // Clean up: close the temporary window
  tempSplitWindow.close();

  return isSupported;
}

How to Use It #

Integrate this detection into your workflow to conditionally use the native API or your iframe fallback:

// Example usage
supportsSplitScreenTarget().then(isSupported => {
  if (isSupported) {
    // Use native split screen
    window.open('https://example.com', '_split');
  } else {
    // Fallback to your custom iframe-based split layout
    console.log("Split screen not supported; using fallback layout");
    // Insert your iframe implementation code here
  }
});

Important Notes #

• Popup Blockers: If the browser blocks the temporary popup, we can't reliably detect support—you may want to default to your fallback in this case, or prompt the user to allow popups for the site.
• Cross-Browser Compatibility: Currently, this detection is tailored to Microsoft Edge's implementation of the Split Screen API. As other browsers adopt the API, you may need to adjust the check (e.g., look for other browser-specific properties or behavior).
• No Official Feature Flag: Unlike many web APIs, there's no supportsSplitScreen() method or similar available yet, so this heuristic approach is the best we have for now.

内容的提问来源于stack exchange，提问作者Simon S.