ウィンドウ管理

1. はじめに

この節は非規範的です。

オペレーティングシステムでは通常、ユーザーが単一のデバイスに複数の画面を接続し、全体的な視覚ワークスペースを 拡張するように仮想的に配置できます。

さまざまなアプリケーションがプラットフォームのツールを使用して、このようなマルチスクリーン環境にコンテンツを配置していますが、 ウェブアプリケーション開発者は、一般に単一画面の使用を中心として設計された既存の API によって制限されています。

マルチスクリーンデバイスおよびアプリケーションがユーザー体験においてより一般的かつ重要な部分になるにつれて、その拡張された 視覚環境を活用するための情報とツールをウェブ開発者に提供することが、より重要になります。

この仕様は、Window、 Screen、 および FullscreenOptions API を段階的に拡張し、新しい ScreenDetails および ScreenDetailed インターフェイスを導入します。これらの変更により、ウェブアプリケーションは特定の画面にコンテンツを配置することで、魅力的な マルチスクリーン体験を提供できます。

1.1. 動機となるユースケース

この仕様の目的は、複数の画面を持つウェブアプリケーションユーザーに、より優れた体験を提供できるようにすることです。 設計の参考となるユースケースには、次のものがあります。

• スライドショーアプリがプロジェクターでプレゼンテーションを表示し、ノートパソコンの画面に発表者用ノートを表示する。

• 金融アプリが複数のモニターにまたがってウィンドウのダッシュボードを開く。

• 医療アプリが画像（X 線画像など）を高解像度のグレースケールディスプレイで開く。

• クリエイティブアプリが補助ウィンドウ（パレットなど）を別の画面に表示する。

• 会議室アプリがタッチスクリーンデバイスに操作部を表示し、テレビに映像を表示する。

• ゲーム、デジタルサイネージ、芸術、およびその他の種類のアプリにおけるマルチスクリーンレイアウト。

• ウィンドウが複数の画面にまたがる場合に、サイトがコンテンツとレイアウトを最適化する。

1.2. 使用方法の概要

マルチスクリーン体験をサポートするために、この API によりウェブアプリケーションは次のことができます。

1. デバイスに複数の画面があるかどうかを検出する

2. 特定の画面にコンテンツを配置するために必要な情報を要求する

3. 画面が追加または削除されたことを検出する

4. 現在の画面またはその属性が変更されたことを検出する

5. 特定の画面に要素を全画面表示する

6. 特定の画面にウィンドウを配置する

7. 単一の一時的なユーザーアクティベーションからマルチスクリーン体験を開始する

// デバイスに複数の画面があるかどうかを検出します。
if (window.screen.isExtended) {
  // 特定の画面にコンテンツを配置するために必要な情報を要求します。
  const screenDetails = await window.getScreenDetails();

  // 画面が追加または削除されたことを検出します。
  screenDetails.addEventListener('screenschange', onScreensChange);

  // 現在の \`ScreenDetailed\` またはその属性が変更されたことを検出します。
  screenDetails.addEventListener('currentscreenchange', onCurrentScreenChange);

  // プライマリ画面を見つけ、そこにコンテンツを全画面表示します。
  const primaryScreen = screenDetails.screens.find(s => s.isPrimary);
  document.documentElement.requestFullscreen({screen : primaryScreen});

  // 別の画面を見つけ、その利用可能領域を新しいウィンドウで埋めます。
  const otherScreen = screenDetails.screens.find(s => s !== primaryScreen);
  window.open(url, '_blank', \`left=${otherScreen.availLeft},\` +
                             \`top=${otherScreen.availTop},\` +
                             \`width=${otherScreen.availWidth},\` +
                             \`height=${otherScreen.availHeight}\`);
} else {
  // 従来の \`Screen\` インターフェイスの属性が変更されたことを検出します。
  window.screen.addEventListener('change', onScreenChange);

  // 従来の単一画面環境内にコンテンツを配置します...
}

1.2.1. 複数の画面の存在を検出する

マルチスクリーン体験をサポートするうえで主要な問題は、コンテンツを配置するときに使用できる複数の画面がデバイスに 存在するかどうかです。これらの画面は、デバイスに内蔵されているもの（ノートパソコンのディスプレイパネルなど）、 有線でデバイスに接続されているもの（HDMI ケーブルで接続されたコンピューターとモニターなど）、その他の方法で デバイスに接続されているもの（Mac と iPad の Sidecar 機能など）、またはディスプレイデバイスの仮想化によるものがあります。 これは、権限プロンプトを表示せずにセキュアコンテキストへ公開される isExtended ブール値によって提供されます。

if (screen.isExtended) {
  // ユーザーにマルチスクリーン操作を提供します。
}

1.2.2. Screen 属性の変更を検出する

従来の Screen 属性の変更を監視することは、単一画面デバイスであってもコンテンツを適応させるために有用です。さらに、 isExtended を監視することは、単一画面構成とマルチスクリーン構成の間の移行を検出するために有用です。ポーリングを回避するため、 change イベントが Screen オブジェクトで発火されます。

screen.addEventListener('change', e => {
  // 従来の \`Screen\` インターフェイスの属性が変更されました。
});

1.2.3. 詳細な画面情報を要求する

デバイスが使用する画面に関する詳細情報は、getScreenDetails() メソッドを介して要求できます。このメソッドは、ユーザーに権限を要求することがあります。結果として得られる ScreenDetails オブジェクトにより、開発者は画面を列挙し、その属性を調べ、変更を監視できます。

try {
  // 画面の詳細を要求し、その情報を直ちに処理します。
  const screenDetails = await window.getScreenDetails();
  processScreenDetails(screenDetails);

  // 画面の集合が変更されたとき、更新された画面の詳細を処理します。
  screenDetails.onscreenschange = () => {
    processScreenDetails(screenDetails);
  };
} catch (err) {
  console.error(err);
  // 拒否された権限およびその他のエラーを処理します。
}

function processScreenDetails(screenDetails) {
  // 想定されるヘルパーを使用して、画面を一覧表示する UI を構築します。
  clearScreenList();
  screenDetails.screens.forEach(screen => {
    addToScreenList({name: screen.label, screen: screen});
    // 特定の画面の詳細が変更されたとき、更新された画面の詳細を処理します。
    screen.onchange = () => {
      processScreenDetails(screenDetails);
    };
  });
  selectCurrentInScreenList(screenDetails.currentScreen);
}

1.2.4. 特定の画面に全画面コンテンツを配置する

一般的なマルチスクリーンのユースケースは、特定の画面に一部のコンテンツを全画面表示することです。画面は対話的に選択することも、 画面の属性またはユーザーによる以前の選択に基づいて自動的に選択することもできます。選択された画面は、requestFullscreen() メソッドに渡すことができます。

// 選択された \`ScreenDetailed\` インスタンスを返す想定のヘルパーを呼び出します。
const screenDetailed = getScreenForSlideshow();

// 選択された画面に特定の要素を全画面表示するよう要求します。
slideshowElement.requestFullscreen({ screen: screenDetailed });

1.2.5. 特定の画面にウィンドウを配置する

もう一つの一般的なマルチスクリーンのユースケースは、特定の画面にウィンドウを配置することです。これは、ScreenDetailed インターフェイスで提供される座標を、既存の open() および moveTo() メソッドとともに使用することで実現できます。

function openCenteredWindow(url, screenDetailed, w, h) {
  // 対象画面の中央にウィンドウを配置する座標を計算します。
  const l = screenDetailed.left + Math.round(screenDetailed.width - w) / 2;
  const t = screenDetailed.top + Math.round(screenDetailed.height - h) / 2;

  // 要求された寸法でウィンドウを開きます。
  return window.open(url, '_blank', \`left=${l},top=${t},width=${w},height=${h}\`);
}

1.2.6. マルチスクリーン体験を開始する

よく要求されるマルチスクリーンのユースケースは、単一のユーザーアクティベーションから魅力的なマルチスクリーン体験を 開始することです。具体的に提案されている形式の一つは、単一のユーザージェスチャーによって、サイトが§ 1.2.4 特定の画面に全画面コンテンツを 配置すること、および§ 1.2.5 特定の画面に ウィンドウを配置することを許可するものです。これは、単一のイベントリスナー内で、最初にマルチスクリーンデバイスの 特定の画面で全画面表示を要求し、次にデバイスの別の画面でポップアップウィンドウを開くことで実現できます。

initiateMultiScreenExperienceButton.addEventListener('click', async () => {
  // プライマリ画面を見つけ、そこにコンテンツを全画面表示します。
  const primaryScreen = screenDetails.screens.find(s => s.isPrimary);
  await document.documentElement.requestFullscreen({screen : primaryScreen});

  // 別の画面を見つけ、その利用可能領域を新しいウィンドウで埋めます。
  const otherScreen = screenDetails.screens.find(s => s !== primaryScreen);
  window.open(url, '_blank', \`left=${otherScreen.availLeft},\` +
                             \`top=${otherScreen.availTop},\` +
                             \`width=${otherScreen.availWidth},\` +
                             \`height=${otherScreen.availHeight}\`);
});

2. 概念

この仕様の概念は、CSSOM-View-1 作業草案およびCSSOM-View-1 編集者草案、[HTML]、ならびに [Fullscreen] の概念を基礎としています。

2.1. 画面

ユーザーエージェントをホストするデバイスには、視覚コンテンツの表示に使用される単一の画面または複数の画面があります。デバイスが使用する画面の集合は、ユーザーエージェントの実行中に、 デバイスのハードウェアまたはソフトウェア構成の変更を反映して変化することがあります。

注: 画面構成の変更の基本的な例には、HDMI ケーブルを使用して テレビまたはプロジェクターをノートパソコンに接続すること、ノートパソコンの蓋を閉じて内蔵 LCD パネルを無効にすること、 および接続されている LCD コンピューターモニターの表示解像度を変更することが含まれます。

2.2. 画面ピクセル

2.3. 画面領域

注: グリッドサイズは通常、<幅>×<高さ> と表されます。例えば、 1920×1080 の画面領域には、幅が 1920 ピクセル、高さが 1080 ピクセルのグリッドがあります。

注: CSSOM View § 2.3 ウェブに公開される画面情報で規定されているように、ユーザーエージェントはユーザーのプライバシーを保護するために、 出力デバイスの画面に関する情報を隠すことを選択できます。この場合、画面領域はビューポートと等しくなることがあります。

2.4. 利用可能な画面領域

2.5. 仮想画面配置

デバイスには、デバイスの視覚環境全体を構成する画面の相対的な配置を定義する仮想画面配置があります。この配置は通常、すべての方向に広がる二次元平面上に 構成され、マルチスクリーン 原点から右方向および下方向にそれぞれ増加する (x, y) 座標を持ちます。マルチスクリーン原点は、仮想画面配置の (0, 0) 座標を定義する、実装定義の点です。

一般的な慣例では、マルチスクリーン原点をプライマリ画面の左上に設定しますが、仮想画面 配置内の任意の点に設定できます。すべての画面の画面領域は、仮想画面配置の矩形の 部分集合を表示するビューです。

次の図は、複数の画面を仮想画面 配置内に配置する方法の例と、考えられるマルチスクリーン原点を示しています。

注: Second Screen Community Group の草案報告書フォームファクターの説明では、関連する用語と概念モデルを 検討しています。

2.6. 画面位置

画面には画面 位置があり、これはマルチスクリーン原点を基準とした仮想画面 配置内における画面領域の (x, y) 座標です。座標は負になることがあり、通常は (x, y) と表されます。

2.7. 利用可能な画面位置

画面には利用可能な 画面位置があり、これはマルチスクリーン原点を基準とした仮想 画面配置内における利用可能な画面領域の (x, y) 座標です。座標は負になることがあり、 通常は (x, y) と表されます。

2.8. プライマリ画面

ユーザーエージェントをホストするデバイスには、厳密に一つのプライマリ画面があります。 その他すべての画面はセカンダリとみなされます。

注: プライマリ画面は通常、Windows のタスクバーや macOS の Dock など、タスク管理用のオペレーティングシステムのユーザーインターフェイスを表示します。

画面のプライマリまたはセカンダリとしての指定は、ユーザーエージェントの実行中に変更されることがあります。

注: ほとんどのオペレーティングシステムでは、Windows の コントロールパネルや macOS の環境設定アプリケーションなどの管理用ユーザーインターフェイスを使用して、ユーザーが プライマリ画面を選択できます。

2.9. 内部画面

各画面は、内部または外部として指定されることがあります。

外部画面は、その視覚出力を提供するデバイスとは 別に製造されます。外部画面が一つのデバイスから 切断され、別のデバイスに接続されることは珍しくありません。

注: 例えば、デスクトップコンピューターは、HDMI ケーブルで 接続された外部画面に視覚出力を表示できます。 コンピューターの使用中に HDMI ケーブルを接続または切断でき、コンピューターはそのハードウェア構成の変更に合わせて 視覚環境を適応させます。

内部画面は通常、製造時にデバイスに取り付けられます。 内部画面は、ユーザーが取り外すことを意図していません。 ただし、内部画面であっても、ユーザーエージェントの実行中に有効または無効にできます。

注: 例えば、ノートパソコンは蓋を閉じたときに内部画面と入力デバイスを無効にすることがあります。 この構成でも、ノートパソコンは外部画面と入力デバイスを使用して引き続き利用できます。蓋が閉じている間、 無効になった内部画面を、デバイスが使用する画面として報告することはできません。

2.10. 現在の画面

Window コンテキストで実行されるスクリプトは、screen 属性にアクセスできます。その Screen オブジェクトは、現在ウィンドウを表示している画面である現在の画面のプロパティを反映します。

注: 多くのオペレーティングシステムでは、ウィンドウを異なる プロパティを持つ複数の画面にまたがって表示したり、「非表示」状態にしてどの画面にも表示しなかったりできます。 オペレーティングシステムおよびユーザーエージェントは、特定の Window に対する正規の画面、例えばウィンドウと交差する領域が最大の画面を定義するものと想定されます。

2.11. 観測可能な画面プロパティ

画面の基本的な観測可能プロパティは次のとおりです。

• 画面 領域の幅および高さ

• 利用可能な画面領域の利用可能な幅および利用可能な高さ

• 色深度

• 向き

画面の高度な観測可能プロパティは次のとおりです。

• 画面 位置

• 利用可能な画面位置

• デバイスピクセル比

• ラベル

• 画面のプライマリまたはセカンダリとしての指定

• 画面の内部または外部としての指定

2.12. ウィンドウ表示状態

トップレベル閲覧コンテキストには、次のいずれかになり得る、関連付けられた表示状態があります。

通常

ウィンドウは通常状態です（最小化、最大化、全画面のいずれでもありません）。

最小化

ウィンドウは最小化されています。

最大化

ウィンドウは最大化されています。

全画面

ウィンドウは全画面モードです。

3. API

3.1. Screen インターフェイスの拡張

CSSOM View Module 仕様は、この仕様によって拡張される Screen インターフェイスを定義します。

partial interface Screen /* : EventTarget */ {
  [SecureContext]
  readonly attribute boolean isExtended;

  [SecureContext]
  attribute EventHandler onchange;
};

CSSOM View § 4.3 Screen インターフェイスにおいて、Screen を EventTarget から派生させます。

3.1.1. isExtended 属性

3.1.2. onchange 属性

onchange 属性は、イベントハンドラー IDL 属性であり、そのイベントハンドラーのイベント型は change です。

Window window の現在の 画面の基本的な観測可能プロパティのいずれかが変更された場合、 window の関連する大域オブジェクトで、ウィンドウ配置タスクソースを使用して大域タスクをキューに追加し、window の screen 属性が参照する Screen オブジェクトで、change という名前のイベントを発火します。

3.2. Window インターフェイスの拡張

[HTML] 標準は、この仕様によって 拡張される Window インターフェイスを定義します。

partial interface Window {
  [SecureContext]
  Promise<ScreenDetails> getScreenDetails();

  [SecureContext]
  Promise<undefined> minimize();

  [SecureContext]
  Promise<undefined> maximize();

  [SecureContext]
  Promise<undefined> restore();

  [SecureContext]
  Promise<undefined> setResizable(boolean resizable);
};

3.2.1. getScreenDetails() メソッド

getScreenDetails() メソッドは非同期に完了し、ウィンドウ配置タスクソースに作業をキューイングします。

Window のインスタンスは、[[screenDetails]] という名前の内部スロットを持つよう作成され、その初期値は undefined です。

3.2.2. アルゴリズム: ウィンドウ表示状態の変更を要求する

3.2.3. minimize() メソッド

minimize() メソッドは非同期に完了し、ウィンドウ配置タスク ソースに作業をキューイングします。

3.2.4. maximize() メソッド

maximize() メソッドは非同期に完了し、ウィンドウ配置タスク ソースに作業をキューイングします。

3.2.5. restore() メソッド

restore() メソッドは非同期に完了し、ウィンドウ配置タスク ソースに作業をキューイングします。

3.2.6. setResizable() メソッド

setResizable() メソッドは非同期に完了し、ウィンドウ配置タスク ソースに作業をキューイングします。

3.2.7. Window の属性およびメソッド定義の変更

次の Window の属性およびメソッド定義は、マルチスクリーン 原点を基準として値を返し解釈するよう更新されます。

• screenX および screenLeft 属性は、マルチスクリーン原点を基準とした、 クライアントウィンドウの左端の x 座標をCSS ピクセル数として 返さなければならず、そのような値が存在しない場合はゼロを返さなければなりません。

• screenY および screenTop 属性は、マルチスクリーン原点を基準とした、 クライアントウィンドウの上端の y 座標をCSS ピクセル数として 返さなければならず、そのような値が存在しない場合はゼロを返さなければなりません。

• moveTo() の手順は、x および y 引数がマルチスクリーン 原点を基準として指定されるものと解釈しなければなりません。

• open() の手順は、"left" および "top" 機能値がマルチスクリーン原点を基準として指定されるものと解釈しなければなりません。

3.2.8. Window.open() メソッド定義の変更

Window のインスタンスは、[[targetScreenFullscreen]] という名前の内部スロットを持つよう作成されます。このスロットは、 最後のアクティベーションのタイムスタンプと同等のデータモデルを持ちます。 二つの場合を除き、これは DOMHighResTimeStamp 値に対応します。正の無限大は、Window が一度もアクティブ化されていないことを示し、負の無限大は、ユーザーアクティベーションによって制限される API （HTML § 6.4.3 ユーザーアクティベーションによって制限される API を参照）が、その Window の最後のユーザーアクティベーションを消費したことを示します。初期値は正の無限大です。

Window.open() メソッドの手順、およびその中で呼び出されるメソッドの手順は、任意で次の処理を行うよう更新されます。

1. 関連する大域オブジェクトの現在の高解像度時刻が、this.[[targetScreenFullscreen]] 以上であり、かつ this.[[targetScreenFullscreen]] に一時的なアクティベーションの持続時間を加えた値より小さい場合、 一時的なアクティベーション状態の要件を免除します。

2. ユーザーアクティベーションを消費する手順を実行した直後に、this.[[targetScreenFullscreen]] を負の無限大に設定します。

3.3. ScreenDetails インターフェイス

[Exposed=Window, SecureContext]
interface ScreenDetails : EventTarget {
  readonly attribute FrozenArray<ScreenDetailed> screens;
  readonly attribute ScreenDetailed currentScreen;

  attribute EventHandler onscreenschange;
  attribute EventHandler oncurrentscreenchange;
};

3.3.1. screens 属性

3.3.2. currentScreen 属性

currentScreen の取得手順は、this に関連付けられた Window オブジェクトの現在の 画面を表す、screens 内の ScreenDetailed オブジェクトを返すことです。

注: screens 内のどの ScreenDetailed オブジェクトが、Window の現在の 画面を表すかは、オペレーティングシステムおよびユーザーエージェントによって定義されるものと想定されます。これは、 特定のウィンドウに対する正規の画面、例えばウィンドウと交差する領域が最大の画面を表す Window.screen に対応します。

注: currentScreen は、そのような比較を容易にするため、例えば screenDetails.screens.find(s => s !== screenDetails.currentScreen); のように、screens 内のいずれかのエントリと === で比較できることが保証されます。そのため、currentScreen を [SameObject] としてマークすることはできません。これに関連して、currentScreen に追加された change イベントリスナーには、その特定の画面に関する変更のみが通知されます。一方、currentscreenchange イベントリスナーには、ウィンドウがある画面から別の画面へ移動した後など、その時点でウィンドウの現在の画面となっている、いずれの画面に関する変更も通知されます。

3.3.3. onscreenschange 属性

onscreenschange 属性は、イベントハンドラー IDL 属性であり、そのイベントハンドラーのイベント型は screenschange です。

ScreenDetails オブジェクト screenDetails の screens の集合が変更された場合、screenDetails の関連する大域オブジェクトで、ウィンドウ配置タスクソースを使用して大域タスクをキューに追加し、screenDetails で screenschange という名前のイベントを 発火します。

3.3.4. oncurrentscreenchange 属性

oncurrentscreenchange 属性は、イベントハンドラー IDL 属性であり、そのイベントハンドラーのイベント型は currentscreenchange です。

Window window の現在の画面が、 ある画面から別の画面へ変更された場合 （例えば、Window が別のディスプレイへ移動された場合）、または window の現在の画面の基本的な 観測可能プロパティまたは高度な観測可能プロパティのいずれかが変更された場合、 window の関連する大域オブジェクトで、ウィンドウ配置タスクソースを使用して大域タスクをキューに追加し、window の内部スロット [[screenDetails]] に格納された ScreenDetails オブジェクトで、currentscreenchange という名前のイベントを 発火します。

3.4. ScreenDetailed インターフェイス

ScreenDetailed オブジェクトは、画面を表します。

[Exposed=Window, SecureContext]
interface ScreenDetailed : Screen {
  readonly attribute long availLeft;
  readonly attribute long availTop;
  readonly attribute long left;
  readonly attribute long top;
  readonly attribute boolean isPrimary;
  readonly attribute boolean isInternal;
  readonly attribute float devicePixelRatio;
  readonly attribute DOMString label;
};

availLeft の取得手順は、this の画面の利用可能な画面 位置の x 座標を返すことです。

availTop の取得手順は、this の画面の利用可能な画面 位置の y 座標を返すことです。

left の取得手順は、this の画面の画面位置の x 座標を返すことです。

top の取得手順は、this の画面の画面位置の y 座標を返すことです。

isPrimary の取得手順は、this の画面がプライマリ画面である場合は true を返し、それ以外の場合は false を返すことです。

isInternal の取得手順は、this の画面が内部である場合は true を返し、それ以外の場合は false を返すことです。

devicePixelRatio の取得手順は、this の画面のデバイスピクセル比を返すことです。

label の取得手順は、this の画面のラベルを返すことです。

3.4.1. onchange 属性

onchange 属性は、Screen から継承された onchange 属性です。

ScreenDetailed オブジェクト screenDetailed が表す画面の基本的な観測可能プロパティまたは高度な観測可能プロパティのいずれかが変更された場合、 screenDetailed の関連する大域オブジェクトで、ウィンドウ配置タスクソースを使用して大域タスクをキューに追加し、screenDetailed で change という名前のイベントを 発火します。

3.5. FullscreenOptions の拡張

partial dictionary FullscreenOptions {
  ScreenDetailed screen;
};

省略可能な FullscreenOptions の screen メンバーは、特定の画面に要素を全画面表示するというアプリケーションの選好を示します。ユーザーエージェントは、 常にアプリケーションの選好よりもユーザーの選好を優先できます。既定値 undefined は、 アプリケーションの選好がないことを示します。

3.5.1. Element.requestFullscreen() メソッド定義の変更

Element.requestFullscreen() メソッドの手順は、任意で次の処理を行うよう更新されます。

1. pendingDoc のトップレベル閲覧コンテキストのアクティブな文書のビューポートを移動およびサイズ変更するときに、 options["screen"] を考慮します。この変更されたメソッド手順の一部として、ビューポートを指定された画面へ移動することがあります。

2. options["screen"] が、isExtended の値が true である、認識済みの ScreenDetailed オブジェクトを指定している場合、this.[[targetScreenFullscreen]] 内部スロットを現在の高解像度時刻に設定します。

3.6. CSS の拡張

この仕様は、ウィンドウの状態に基づいてスタイルシートを適応できるようにする、新しい CSS メディア機能を定義します。

3.6.1. 「display-state」メディア機能

「@media/display-state」メディア機能は、現在の閲覧コンテキストが現在エンドユーザーに提示されているウィンドウの状態を 説明します。子閲覧コンテキストでは、表示状態はトップレベル閲覧コンテキストの表示状態と一致しなければなりません。

この機能は主に、アプリケーションコンテキストを実行しているユーザーエージェントに、 ホストオペレーティングシステムがどの表示状態を適用したかを判定するために使用されます。

normal

閲覧コンテキストは、通常表示状態で表示されます。

minimized

閲覧コンテキストは、最小化表示状態で表示されます。

maximized

閲覧コンテキストは、最大化表示状態で表示されます。

fullscreen

閲覧コンテキストは、全画面表示状態で表示されます。

3.6.2. 「resizable」メディア機能

「@media/resizable」メディア機能は、ウィンドウをユーザーがサイズ変更できるかどうかを説明します。

true

ユーザーはウィンドウの端をドラッグして、ウィンドウのサイズを変更できます。

false

ユーザーはウィンドウの端をドラッグして、ウィンドウのサイズを変更できません。

3.7. Permission API との統合

この仕様は、名前 「window-management」によって識別される既定の強力な機能を定義します。

[permissions] API は、 ウェブサイトが権限の状態を照会するための統一された方法を提供します。

注: この文書の以前に公開されたバージョンでは、 権限名 "window-placement" を使用していました。ユーザーエージェントは、更新された権限文字列 「window-management」 へ慎重に移行するべきです。#114 を参照してください。

window-management を [permissions] レジストリに追加します。

権限が取り消された場合の、 キャッシュされたオブジェクトおよびメソッド手順の動作を定義します。（#80 を参照）

3.8. Permission Policy との統合

この仕様は、isExtended、 getScreenDetails、 およびそれらに依存する機能を使用できるかどうかを制御する、文字列 "window-management" によって識別されるポリシー制御機能を定義します。この機能の既定の許可リストは 'self' です。[permissions-policy] およびその実験的 機能の一覧を参照してください。

注: 文書の Permissions Policy は、その文書内のコンテンツが isExtended から意味のある値を取得すること、ScreenDetails にアクセスすること、または特定の画面にコンテンツを配置することを許可されるかどうかを決定します。無効にされている場合、 isExtended は false を返し、getScreenDetails が返す promise は拒否され、特定の画面にコンテンツを配置する要求は現在の画面に制限されます。

適切な時期に window-management を提案済み または標準化済み 機能の一覧へ移動します。

4. セキュリティに関する考慮事項

この仕様により、サイトは特定の画面にコンテンツを配置できるようになりますが、これによって限定的な新しいセキュリティリスクが 生じる可能性があります。

1. サイトが予期しない画面に機密性の高いコンテンツを目立つように表示しようとする可能性があります

2. サイトが、例えば次のように、あまり目立たない画面に望ましくないコンテンツを密かに表示しようとする可能性があります。

3. サイトがユーザーの注意を特定の画面に引き付け、そこでの操作シグナルを使用して、あまり注意深く監視されていない 別の画面に欺瞞的なコンテンツを表示することで、フィッシング攻撃のために OS、ブラウザー、または他のサイトを 偽装しようとする可能性があります

4. サイトが、その他の方法で特定の画面にコンテンツを配置し、欺瞞的、濫用的、または迷惑な方法で動作しようとする 可能性があります

このようなリスクを軽減するため、画面をまたぐ配置機能にはセキュアコンテキストで明示的な権限が必要であり、既定で 第三者によるアクセスを防止する [permissions-policy] の対象となります。

ユーザーエージェントは画面をまたぐ配置要求を検出し、潜在的な濫用からユーザーを保護するために介入できます。例えば、 サイトが別の画面にコンテンツを配置したとき、または画面をまたぐ配置後にウィンドウがユーザーの注意を引いたとき、 ユーザーエージェントは目立つセキュリティ表示を提示できます。さらに、画面をまたぐ配置要求を拒否したり、一部の ユーザーエージェントの既存の動作と同様に、現在の画面に制限したりできます。

その他の注意点は次のとおりです。

• 一部のユーザーエージェントは、すでにウィンドウ配置要求を現在の画面に制限していません。それらは open() および moveTo() の座標をマルチスクリーン原点に対する相対値として解釈し、現在の画面以外の画面にウィンドウを配置する要求を受け入れます。

• 通常、requestFullscreen() および open() には一時的なユーザーアクティベーションがすでに必要ですが、moveTo()、 moveBy()、 resizeTo()、 および resizeBy() には必要ありません。

• ユーザーのカーソルまたは指は、別の画面ではなく現在の画面と同じ場所にある可能性が高いため、現在の画面以外の画面にコンテンツを配置しても、ユーザーに追加の クリックジャッキングリスクが生じる可能性は低いと考えられます。

• 従来の配置機能を指定された権限によって制限することは、実現可能である場合があります。

セキュリティに関する考慮事項については、次の追加検討を参照してください。

• API 全体に関する W3C セキュリティおよびプライバシー自己レビュー質問票

• API 全体の Explainer における「プライバシーとセキュリティ」

• 「マルチスクリーン体験の開始」に関する W3C セキュリティおよびプライバシー自己レビュー質問票

• 「マルチスクリーン体験の開始」の Explainer における「セキュリティに関する考慮事項」

• 「追加のウィンドウ制御」に関する W3C セキュリティおよびプライバシー自己レビュー質問票

• 「追加のウィンドウ制御」の Explainer における「セキュリティおよびプライバシーに関する考慮事項」

5. プライバシーに関する考慮事項

この仕様は、デバイスに接続された画面に関する新しい情報をサイトに公開します。これにより、限定的な新しいプライバシーリスクが 生じる可能性があります。この追加情報は、特に一般的でない画面構成を持つデバイスのフィンガープリンティング可能な範囲を拡大します。

このようなリスクを軽減するため、新しい情報は一般的な配置のユースケースに必要な最小限に抑えられ、ほとんどのアクセスには セキュアコンテキストで明示的な権限が必要であり、既定で第三者によるアクセスを防止する [permissions-policy] の対象となります。公開される画面の一覧には、 相互運用性の問題を減らし、フィンガープリンティングを軽減するために定義された順序があります。一般にユーザーエージェントは、 サイトが新しい情報を要求したときに、その要求を測定したり、その他の方法で介入したりできます。

Screen.isExtended ブール値は、明示的な権限チェックなしで公開されます。この最小限の 1 ビットの情報は、 権限プロンプトが煩わしくなる重要な機能（例えば、「別の画面に表示」のようなマルチスクリーン UI の入口を表示または非表示に する機能）をサポートし、単一画面のユーザーに適用できない情報や機能について不必要に権限を要求することを回避するためです。 これは概ね、デバイス列挙に関する TAG の設計原則（ウェブプラットフォーム設計 原則 § 9.2 デバイスを選択または列挙する API を公開するときは注意するを参照）に従っています。

多くのユーザーエージェントは、window.screen.availLeft|Top >> 0 となるセカンダリ画面上の ウィンドウに対して、複数の画面が存在することを事実上すでに公開しています。スクリプトによるこのビットへのアクセスは、 検出可能なアクティブフィンガープリンティングシグナルであり、 ユーザーエージェントによって監視およびブロックされる可能性があります。さらに、権限のないウィンドウ配置要求を現在の 画面に制限しないユーザーエージェントでは、攻撃者が別の画面へのプログラムによる配置を試みることができ、その時点で その window.screen に関する情報が公開されます。

新しい Screen.onchange イベントは、一時的フィンガープリンティングを容易にするため、 わずかなリスクをもたらします。しかし、スクリプトはすでに window.screen の変更をポーリングすることで 同じ結果を得られます。このリスクは、非表示の文書が非表示でなくなるまで、その文書に対するイベントのディスパッチを遅延させる ことで、部分的に軽減できる可能性があります。

サイトに与える権限をより小さくする別の API 形式も検討されましたが、ユーザーおよび開発者にとって使い勝手が悪くなります （例えば、ユーザーに画面を選択させる、開発者に宣言的な画面の順位付けを要求するなど）。接続されている任意の画面に、 全画面ではないアプリウィンドウを配置するための代替手段は、あったとしてもほとんどありません。規定された API 形式は、 より完全なマルチスクリーン環境をサポートするための、既存 API の最も自然な拡張であると考えられます。将来の作業には、 サイトが自発的に情報公開を最小限に抑えられるよう、より限定されたマルチスクリーン情報を照会する方法が含まれる可能性があります。

規定された API 設計により、ユーザーエージェントは、ユーザーが指定した画面に関する画面情報および配置機能を制限するなど、 新しいアクセスモデルを使用して画面を選択的に公開できます。

その他の注意点は次のとおりです。

• 従来の画面およびウィンドウ情報を指定された権限によって制限することは、実現可能である場合があります。

プライバシーに関する考慮事項については、次の追加検討を参照してください。

• API 全体に関する W3C セキュリティおよびプライバシー自己レビュー質問票

• API 全体の Explainer における「プライバシーとセキュリティ」

• 「マルチスクリーン体験の開始」に関する W3C セキュリティおよびプライバシー自己レビュー質問票

• 「追加のウィンドウ制御」に関する W3C セキュリティおよびプライバシー自己レビュー質問票

• 「追加のウィンドウ制御」の Explainer における「セキュリティおよびプライバシーに関する考慮事項」

6. アクセシビリティに関する考慮事項

この仕様により、サイトは特定の画面にコンテンツを配置できるようになりますが、これによって限定的な新しいアクセシビリティリスクが 生じる可能性があります。視覚的な表示、非視覚的なレンダリング、および支援技術がコンテンツ自体に及ぼす影響は、通常、 コンテンツをある画面に配置するか別の画面に配置するかによって大きく左右されるものではありません。それでも、 プログラムによるコンテンツ配置に関する既存のアクセシビリティリスクは、コンテンツを配置できる領域が拡大することによって 悪化する可能性があります。既定の強力な機能の権限モデル、プロンプト方法、および 権限関連 UI に関する既存のアクセシビリティ上の考慮事項は、この仕様の権限にも同様に関係します。

現時点では、この API によって公開される構造化された画面情報（およびそのアクセシビリティ機能）に関して、 文書化されたアクセシビリティ上の考慮事項はありません。

7. 国際化に関する考慮事項

現時点では、文書化された国際化に関する考慮事項はありません。

8. 謝辞

この仕様の作成に協力してくださった Adrienne Walker、 Anssi Kostiainen、 Chris Terefinko、 Domenic Denicola、 Jonathan Garbee、 Kenneth Rohde Christiansen、 L. David Baron、 Lukasz Olejnik、 Marijn Kruisselbrink、 Matt Giuca、 Michael Ketting、 Nadav Sinai、 Peter Linss、 Reilly Grant、 Staphany Park、 Theresa O’Connor、 Thomas Nattestad、 Thomas Steiner、および Victor Costan に深く感謝します。

誰も記載し忘れていないことを 確認してください！

この文書の作成に使用された仕様記述ツール Bikeshed を作成および保守し、仕様記述全般について助言してくださった Tab Atkins, Jr. に特に感謝します。