コハム

Webクリエイターのコハムが提供する、Web制作に役立つ情報をまとめたブログです。

トップ > Safari > Safari 18.0がやってきた！注目の新機能を一挙に紹介！

Safari 18.0がやってきた！注目の新機能を一挙に紹介！

Safari iOS Mac OSX

9月16日にSafari 18.0がリリースされました。 リリースノートより注目の新機能を中心にご紹介します。

Safari 18.0は、iOS 18、iPadOS 18、visionOS 2、macOS 15、macOS Sonoma、およびmacOS Venturaで利用可能です。

アクセシビリティ

新機能

  • <input type="datetime">、<input type="datetime-local">、および<time>要素のサポートを追加。(118180250)
  • ariaBrailleLabelとariaBrailleRoleDescription要素反射プロパティのサポートを追加。(123926949)

解決された問題

  • <main>およびセクショニング要素内の<header>のロール割り当てを修正。(48370244)
  • アクセシビリティAPIを介して増減された場合、range入力がinputイベントを発火しない問題を修正。(85707481)
  • スロットにaria-hiddenを設定してもスロットの割り当てられたノードが非表示にならない問題を修正。(108762653)
  • VoiceOverが隠れた関連ラベルを読み上げるよう修正。(113631557)
  • コンボボックスがリンクされたオブジェクトを正しく公開するよう修正。(121242926)
  • macOSでVoiceOverのaria-activedescendantサポートを修正。(122590052)
  • サブフィールドにラベルを追加することで時間入力のアクセシビリティを改善。(122590568)
  • <body>と<html>要素でaria-hidden=trueが無視されるよう修正。(123049663)
  • 日時の値がアシスティブテクノロジーに誤ったタイムゾーンで公開される問題を修正。(123522296)
  • datetime-local入力に対して誤った日時の値がアシスティブテクノロジーに公開される問題を修正。(123803281)
  • CSSのcontent プロパティの置換テキストが空文字列の場合に無視される問題を修正。(123919677)
  • 以下の要素の計算されたロールを修正: dd、details、dt、em、hgroup、option、s、strong。(124641956)
  • aria-labelledbyによってターゲットにされた隠れた要素が、直接の子テキストだけでなくサブツリー全体のテキストを公開するよう修正。(125634439)
  • visibility: hiddenのコンテナ内でvisibility: visibleを持つ要素のアクセシブルな名前の計算を修正。(125738704)
  • キャプションが動的に変更された後のテーブルアクセシビリティテキストの更新を修正。(127263464)
  • ターゲットとされた要素がサブツリーを変更した後のaria-describedbyテキストの更新を修正。(127390465)

アニメーション

解決された問題

  • transitionプロパティが最短のシリアライゼーションを生成するよう修正。(119822401)
  • animationプロパティが最短のシリアライゼーションを生成するよう修正。(120439368)

キャンバス

新機能

  • willReadFrequentlyのサポートを追加。(126739379)
  • color-mixまたは相対色で使用されるネストされたcurrentcolorの解決のサポートを追加。(128027026)

解決された問題

  • drawImage(detachedOffscreenCanvas)が例外をスローするよう修正。(120451062)
  • ネストされたワーカーでOffscreenCanvasがプレースホルダーにレンダリングできない問題を修正。(126069375)
  • タブを切り替えた際にOffscreenCanvasのプレースホルダーキャンバスのコンテンツレイヤーが失われる問題を修正。(126070648)
  • drawImageが入力ソースまたは出力先の矩形を変更しないよう修正。(127982607)
  • キャンバスの親の可視性を切り替えるとclearRect()の効果が元に戻る問題を修正。(128226178)
  • 画像が破損状態の場合、Canvas drawImage() APIが例外をスローするよう修正。(128588063)
  • デタッチされたOffscreenCanvasがImageBufferを転送しないよう修正。(129270155)

廃止

  • OffscreenCanvasRenderingContext2Dのcommit()メソッドのサポートを削除。(126758254)

CSS

新機能

  • 相対色構文にcurrentColorとシステムカラーキーワードのサポートを追加。(100981965)
  • (prefers-contrast: custom)のサポートを追加。(103658875)
  • content-visibilityのサポートを追加。(117156105)
  • displayプロパティのアニメーションのサポートを追加。(121662911)
  • CSSスタイルコンテナクエリのサポートを追加。(122800215)
  • ビュートランジションのサポートを追加。(123128491)
  • プレフィックスなしのbackdrop-filterのサポートを追加。(123523441)
  • :active-view-transition疑似クラスのサポートを追加。(129851076)

解決された問題

  • 空白または改行に対してwhite-spaceを動的に非デフォルト値に設定する問題を修正。(92559818)
  • 右から左の方向でdisclosure-openとdisclosure-closedカスタムカウンタースタイルが正しい方向を指すよう修正。(109014745)
  • backface-visibilityがスタッキングコンテキストと包含ブロックを作成するよう修正。(114732608)
  • ::highlight()のような機能的疑似要素でgetComputedStyle()が機能するよう修正。(117864743)
  • :-webkit-full-screen疑似クラスを:fullscreenにエイリアス化。(120335917)
  • :-webkit-any-linkを:any-linkに、:matches()を:is()にエイリアス化。(120337922)
  • getComputedStyle()疑似要素解析がCSSの構文の全範囲をサポートするよう修正。(120471227)
  • 一部の-webkitプレフィックス付き疑似要素が誤ってサポートされていないと扱われていた@supportsを修正。(120577690)
  • スタイル変更後のメディアクエリに敏感なメタタグの更新を修正。(120854167)
  • カラースキームの変更がシステムカラーやlight-dark()を使用したグラデーションを更新するよう修正。(121285450)
  • font-synthesisとfont-variant-caps: all-small-capsを使用した際のインライン要素サイズの不正確さを修正。(121314557)
  • :emptyセレクタがアニメーションで機能するよう修正。(122838142)
  • カスタムプロパティのシリアライズ時に空白を保持するよう修正。(123491915)
  • 非継承カスタムプロパティの変異に対してスタイルを正しく更新するよう修正。(123645196)
  • 親によって削除された要素が最後に記憶されたサイズを失う問題を修正。(123975513)
  • カスタムプロパティの暗黙的な初期値と明示的な初期値の不一致を修正。(124573975)
  • MenuとMenuTextシステムカラーのコントラストを修正。(125270664)
  • CSSのgapのショートハンド値をシリアライズされた値と計算された値で維持するよう修正。(125335787)
  • @starting-styleのスタイルアジャスターが要素がnullの場合に誤って呼び出される問題を修正。(125837628)
  • -apple-pay-buttonがappearance: autoをサポートし、ボタンではない要素に適用されないよう修正。(126107516)
  • CSS色仕様に追加された色解釈メソッドの欠落を修正。(126444371)
  • 最新の仕様変更に合わせてhsl()とhsla()の実装を修正。(126722229)
  • 最新の仕様に合わせてrgb()とrgba()の実装を修正。(126830606)
  • 最新の仕様に合わせてhwb()の実装を修正。(126924645)
  • 最新の仕様変更に合わせて残りの色タイプを同期。(127077683)
  • 色を補間する際に類似のコンポーネントを前方に運ぶよう修正。(127170141)
  • mask-modeのフィルレイヤーパターンの適用を修正。(127999241)
  • ページ読み込み時に存在しない要素に対してbackdrop-filter: blurがレンダリングされるよう修正。(129517679)
  • 大規模なGridのパフォーマンスを改善。(130728344)
  • 一部のCSSプロパティによって引用符がリセットされる問題を修正。(132585704)

廃止

  • CSSRuleからWEBKIT_KEYFRAMES_RULEとWEBKIT_KEYFRAME_RULEを削除。(97084520)
  • :-webkit-full-screen-ancestor疑似クラスを削除。(100782937)
  • -webkit-altとaltプロパティを削除。(120051066)
  • 非標準のresize: autoルールを削除。(120138995)
  • :-webkit-animating-full-screen-transition疑似クラスを削除。(121302758)
  • :-khtml-drag疑似クラスを削除。(121303391)
  • :-webkit-full-screen-controls-hidden疑似クラスを削除。(121323330)
  • :-webkit-full-page-media疑似クラスを削除。(121752962)
  • :-webkit-full-screen-document疑似クラスを削除。(121816310)

フォーム

新機能

  • iOSで<input type=checkbox switch>に触覚フィードバックを追加。(125474921)
  • 部分的に透明なアクセントカラーのサポートを追加。(130599744)

解決された問題

  • DOM更新後に表示されたdatalistドロップダウンがそのoptions要素を同期するよう修正。(54690831)
  • 入力要素が最初のフォールバックステップベースとして[value]を使用するよう修正。(107721910)
  • <select multiple>のスクロールバーが使用されているカラースキームに一致するよう修正。(123807167)
  • <datalist>要素から<option>を選択した際の入力値の更新を修正。(124784204) (FB13688998)
  • type="email"とmultiple属性を持つ入力要素でvalue属性が表示されない問題を修正。(125221858)
  • iOSの<input type=checkbox switch>のアニメーションを修正。(125563501)
  • ウィンドウが非アクティブな場合にフォームコントロールがアクティブな外観で描画される問題を修正。(127391198)
  • 構築されたFormDataオブジェクトが、デフォルトでイメージボタンサブミッターのエントリーを含まないよう修正。(128176811)

HTML

解決された問題

  • "about:blank" の document.referrer 初期化を修正。(97689906)
  • 自己閉じSVGスクリプト要素の解析を修正。これにより正常に実行されるようになりました。(121887875)

画像

廃止

  • JPEG2000のサポートを削除。(35161822)

JavaScript

新機能

  • RegExp.prototype[Symbol.matchAll]でのvフラグのサポートを追加。(126017731)
  • RegExpでUnicode 15.1.0文字のサポートを追加。(126863692)

解決された問題

  • RegExp.prototype.@@splitが以下のレガシーなRegExp静的プロパティを更新するよう修正: RegExp.input, RegExp.lastMatch, RegExp.lastParen, RegExp.leftContext, RegExp.rightContext, および RegExp.$1, ... RegExp.$9。(99865597)
  • パターンがRegExpオブジェクトでlastIndexが数値でない場合、String.prototype.replaceが高速パスを取らないよう修正。(101122567)
  • Async / Await、ジェネレータ、非同期関数、非同期ジェネレータの仕様準拠を修正。(113884730)
  • 非同期関数とジェネレータが、"constructor"ゲッターがスローするプロミスを適切に処理するよう修正。(119734587)
  • 非同期ジェネレータのreturnが値を正しく待機するよう修正。(119834751)
  • Symbol.speciesゲッターが単一のJS関数を共有しないよう修正。(120416817)
  • 負のsizeプロパティを持つオブジェクトでSetメソッドが呼び出された場合、RangeErrorをスローするよう修正。(121310940)
  • 別のレルムからのeval()関数が直接eval呼び出しを引き起こさないよう修正。(121546048)
  • ...スプレッド構文を使用したeval()呼び出しが直接呼び出しになるよう修正。(121547890)
  • 派生クラスのConstructで発生したエラーをtry/catchが捕捉しないよう修正。(121959506)
  • 以下の問題を修正:
    • レストパラメータ内のデフォルト値式での直接eval()が、パラメータの別の環境ではなく関数の環境で変数を作成する
    • レストパラメータ内で定義されたバインディングにeval()またはそれ以前のパラメータのデフォルト値式で作成されたクロージャでアクセスする際、同名のvarバインディングがある場合のみReferenceErrorがスローされる
    • レストパラメータ内のデフォルト値式で作成されたクロージャが、それ以前のパラメータのものとは異なる関数のVariableEnvironmentで作成され、varバインディングによって"シャドウ"されたパラメータ名をクエリまたは変更する際に不正確な環境が参照される (121961421)
  • 比較関数がfalseを返す場合のTypedArrayソートメソッドの特殊ケースを修正。(122093956)
  • setExpectionPortsのビット演算子ANDのプログラミングスタイルを修正。(122138733)
  • TDZチェック前にアロー関数のレキシカル環境からthis値を読み込むようemitReturn()を修正。(122430056)
  • ラテン1文字に対するNFKC正規化を修正。(123328161)
  • Unicodeの開始文字を持つプライベート名の解析を修正。(123425805)
  • LHSがプリミティブの場合にinstanceofがRHSのプロトタイプを取得しないよう修正。(123629166)
  • ブラケット更新式がプロパティキーを最大1回解決するよう修正。(123872374)
  • ブラケット複合代入がプロパティキーを最大1回解決するよう修正。(124420301)
  • 非オブジェクトに対してObject.groupByとMap.groupByが機能するよう修正。(125485685)
  • Array.fromAsyncが配列コンストラクタを2回呼び出さないよう修正。(125509304)
  • アクセサプロパティに対するFunction.prototype.toStringの出力の不整合を修正。(125739577)
  • Set#symmetricDifferenceが各イテレーションでthis.hasを呼び出すよう修正。(126526845)
  • 代入の左側が関数呼び出しの場合、論理代入式が構文エラーをスローするよう修正。(126540636)
  • RegExで入れ子になった重複名のキャプチャグループに対して構文エラーをスローするよう修正。(126863735)
  • ArrayBufferとSharedArrayBufferコンストラクタがインスタンス作成前に長さをチェックするよう修正。(126971134)
  • 仕様の更新に基づいて"GMT"を"UTC"に正規化するようIntl実装を修正。(127061600)
  • v8と異なるRegEx後方参照を修正。(127440248)
  • Intl.DurationFormatのfractionalDigitsが省略された場合、最大9桁として扱われるよう修正。(129145390)
  • 最適化されたTypedArraysが不正確な結果を返す問題を修正。(129303210)
  • numeric と 2-digit に対するIntl.DurationFormatを修正。(130279541)

廃止

  • 仕様の変更を反映して、グローバルオブジェクトからVarNamesを削除。(130438575)

読み込み

解決された問題

  • Cookieがブロックされている場合、navigator.cookieEnabledがfalseを返すよう修正。(121284878)

メディア

新機能

  • WebRTC HEVC RFC 7789 RTPペイロードフォーマットのサポートを追加。(112001659)
  • macOSで、目立つビデオ要素を持つWebページ用のフルウィンドウビデオ視聴モードであるViewerのサポートを追加。(114218891)
  • ワーカーでのMSEのサポートを追加。(123052315)

解決された問題

  • サイズメタデータ属性が提供されている場合、MediaSessionが使用する最適なサイズのアートワークを決定するよう修正。(81160539) (FB9409169)
  • visionOSのタブバーでタブを切り替えた後、別のウィンドウからビデオの音が聞こえる問題を修正。(120018549)
  • 一部のサイトでMSEビデオの再生を修正。(123528095)
  • ビデオのcurrentTimeがギャップの開始時間よりも先に進むことを許可するよう修正。(124186726)
  • Vorbisトラックを含むWebMファイルの音声再生が壊れる問題を修正。(124880261)
  • 有効なAudioEncoderConfigでsampleRateとnumberOfChannelsが必須かつゼロ以外であることを確認するよう修正。(125107934)
  • メディア要素が同じメディアセグメントを2回追加する問題を修正。(125386530)
  • visionOSで、Safariの音声が誤ったウィンドウから出力される問題を修正。(127009932)
  • 'hours'が1桁で定義されている場合に有効なNPT文字列を拒否する問題を修正。(128318772)
  • Viewerモード中に<video>要素を非表示にした場合のピクチャーインピクチャーを修正。(131786564)
  • ピクチャーインピクチャーでビデオが一時停止され再生された後、戻るボタンが機能しない問題を修正。(131791367)

廃止

  • 非標準のVTTRegion.trackを削除。(123172214)

レンダリング

解決された問題

  • 一部の文字でギリシャ語の大文字変換が失敗する問題を修正。(90364897)
  • 1remのパディングを持つ<textarea>要素のリサイズを修正。(90639221)
  • カラーマトリックスフィルタの色の正確さを修正。(120795573)
  • border-radiusを持つ要素のボーダー領域にbackdrop-filterが適用されるよう修正。(122295068)
  • ゼロでないマージンを持つ空の子の前の空白を考慮するよう内在的インラインサイズ計算機を修正。(122586712)
  • height: 100%がネストされたコンテンツに適用された場合のフレックスボックスでの要素の重なりを修正。(125572851)
  • フローから外れた兄弟要素がある場合のグリッドアイテムの不正確な位置決めを修正。(126207467)
  • フロートを伴うbreak-wordがテキストを破棄する問題を修正。(126309547)
  • スタイルのない唯一の子のインライン要素に対するmin-content計算を修正。(128348427)
  • position: relativeとtopが使用されている場合に省略記号が複数回レンダリングされる問題を修正。(128394449)
  • 継続内のブロックの後に逆順で挿入されたインライン要素のバグを修正。(128826228)
  • ウィンドウがリサイズされた際にフッターにページの背景色のバーがフラッシュする問題を修正。(128940179)
  • 複数のインストールされたフォントが同じ名前を持つ場合に、誤ったフォントのグリフIDを使用してグリフ検索を行うことで太字テキストが文字化けする問題を修正。(129891005) (FB13909556)
  • 縦書きモードのテーブルでルビで注釈付けされた日本語テキストの選択を修正。(130974783)
  • MathMLのmfracとmspace要素に対するボーダー、パディング、マージンのサポートを修正。(131119823)

セキュリティ

解決された問題

  • ページにフラグメントを公開しないよう、URLからスクロールテキストフラグメントを削除するよう修正。(124717009)
  • 0.0.0.0ホストとモード "no-cors" を使用したプライベートlocalhostドメインでのCORSバイパスを修正。(125913679)
  • iframeでのクロスオリジンリダイレクトダウンロードをブロックするよう修正。(130901951)
  • ブロックされたクロスオリジンリダイレクトダウンロードが代わりにページのレンダリングを試みるよう修正。(131962658)

SVG

解決された問題

  • 標準に合わせてSVGのリンクにcursor: pointerを適用するUAスタイルシートを修正。(122715957)
  • ページでレンダリングされない場合、SVGグラデーションのstop-colorの初期値を返すよう修正。(123262508)
  • マーカーパスがサブパスで構成されている場合のSVGマーカーセグメント計算を修正。(123434203)
  • WebIDL仕様に合わせてSVGLengthを同期。(129169603)

廃止

  • SVGGraphicsElementから非標準のgetTransformToElementを削除。(122435702)
  • SVGAnimateColorElementインターフェースを削除。(122586568)

テキスト

解決された問題

  • 開示カウンタースタイルがwriting-modeを考慮するよう修正。(130468537)

Web Animations

解決された問題

  • 幅と高さがアニメーション化されている場合のパーセンテージ変換アニメーションを修正。(63309680)
  • 暗黙的なキーフレームでアニメーション化されているプロパティの値を変更する際のアニメーションの更新を修正。(126126617)
  • displayからnoneへのトランジションを修正。(130857338)

Web API

新機能

  • URL.parse()のサポートを追加。(125376520)
  • <template>にshadowRootDelegatesFocusとshadowRootClonableのサポートを追加。(125401993)
  • getHTML()を通じたシャドウルートのシリアル化と、対応するシャドウルートシリアル化可能機能のサポートを追加。(125513986)
  • PopStateEventのhasUAVisualTransitionのサポートを追加。(125849073)
  • インポートされたモジュールスクリプトのサブリソース整合性のサポートを追加。(127038535)
  • document.fragmentDirectiveを公開することでテキストフラグメントの機能検出のサポートを追加。(127650843)
  • RequestとResponseにbytes()メソッドのサポートを追加。(128407577)
  • BlobとPushMessageDataにbytes()のサポートを追加。(128418858)

解決された問題

  • シリアル化が異なる場合、cssTextセッターがstyle属性を変更するよう修正。(29861252) (FB5535475)
  • history.pushState()とhistory.replaceState()がtitle引数を無視するよう修正。(75695791)
  • JavaScriptからURLテキストフラグメントディレクティブが完全に削除されない問題を修正。(107326333)
  • showPicker()メソッドがdatalistからの提案をトリガーするよう修正。(116017782)
  • 名前空間のないlang属性がHTMLとSVG要素にのみ適用されるよう修正。(117795695)
  • iframeのフルスクリーンフラグを不必要に解除する問題を修正。(120052751)
  • CDATASectionノードを正しく考慮するようDOM Rangeを修正。(122608224)
  • getGamepads()が安全でないコンテキスト警告をトリガーしないよう修正。(123039555)
  • 同じ画像を2回表示する<picture>要素の挿入を修正。(123795045)
  • デタッチ状態の場合、ナビゲーションメソッドが例外をスローするよう修正。(123898636)
  • URLのhostセッターの軽微な問題を修正。(124363495)
  • DOM標準の明確化に従ってShadowRootノードのクローン作成を修正。(125917138)
  • GeolocationCoordinatesがtoJSON()メソッドを公開するよう修正。(126183686)
  • 通知の発火に失敗することがあるIntersectionObserverを修正。(126238865)
  • GeolocationPositionがtoJSON()メソッドを公開するよう修正。(126247408)
  • イベントをディスパッチする際のCustomEvent.targetの設定を修正。(126369768)
  • iOS 17.4でnavigator.languageがシステム言語のみを返す問題を修正。(126765790)
  • <hr>のwidth属性からプレゼンテーションヒントを削除。(128647444)
  • 編集可能なdisplay: gridコンテナに書き込み提案を挿入する際の問題を修正。(129366300)
  • window.styleMediaの警告メッセージを修正。(131005713)

廃止

  • KeyboardEvent.altGraphKeyのサポートを削除。(102980723)
  • WebCryptoからAES-CFBサポートを削除。(120000331)
  • 非標準のKeyboardEvent.keyLocationを削除。(121564228)
  • HashChangeEventの非標準initHashChangeEvent()メソッドを削除。(124736521)

Web アプリ

新機能

  • macOSのWebアプリでリンクを直接開くサポートを追加。(113034778)

解決された問題

  • すべてのWebアプリに対して関連ドメインのwww.サブドメインの解決を修正。(121216556)

Web Inspector

新機能

  • CSSソースエディタにファジー検索コード補完のサポートを追加。(125030691)

解決された問題

  • 監査タブのフォントサイズを修正。(76162927)
  • ストレージの展開されたセクションが折りたたまれない問題を修正。(107687975)
  • Web Inspectorがネストされたワーカーを表示するよう修正。(108322385)
  • !importantとマークされたCSSフォントプロパティ値が対話的編集コントロールを使用して上書きされない問題を修正。(112080113)
  • Web Inspectorのビューポートが切り取られて表示される可能性がある問題を修正。(117272735)
  • 監査タブでランタイムが整列するよう修正。(121810292)
  • コンソールタブでメッセージタイプの選択を記憶するよう修正。(122924275)
  • text-indentプロパティの自動補完がeach-lineやhangingの代わりにプレフィックス付きプロパティを提案する問題を修正。(123240715)
  • backgroundの自動補完提案にrepeating-conic-gradientを含めるよう修正。(123428709)
  • Web Inspectorがリロードされた際にソースタブのブレークポイントリストが消える問題を修正。(123641994)
  • Web Inspectorが再開した際に予期せずコンソールがクリアされる問題を修正。(124171190)
  • コンソールのコード補完が大文字小文字を区別しないよう修正。(124544458)
  • DOMツリーから要素をハイライトする際にoverflow: scroll要素が期待通りにスクロールするよう修正。(124554999)
  • 開発メニューにiOSデバイスからの追加のSafariタブを表示するよう修正。(124876362)
  • コンソールとコードエディタの補完が提案を自動的にビューにスクロールしない問題を修正。(124979790)
  • DOMツリービューでの検索が予期せずテキスト表示を変更する問題を修正。(125797803)
  • "独立したスタイルサイドバーを表示"が無効の場合に計算されたCSSの"goto"矢印をクリックする問題を修正。(127025520)
  • visionOSシミュレータのSafariから検査可能なタブがホストmacOSの開発者メニューに表示されない問題を修正。(127259433)
  • スイッチコントロールのアクセシビリティインスペクタが"Checked: true/false"の代わりに"State: on/off"を報告するよう修正。(128952449)

WebGL

新機能

以下の承認された拡張機能のサポートを有効化: - EXT_texture_mirror_clamp_to_edge - WEBGL_render_shared_exponent - WEBGL_stencil_texturing - EXT_render_snorm - OES_sample_variables - OES_shader_multisample_interpolation (121835897) (126863775)

Web制作者向けの新機能やバグフィックスを中心にご紹介しました。

©コハム