【Swift】WKPreferences の minimumFontSize が効かない

下記ブログの転載です！
https://rc-code.info/ios/post-236/

iOSの**`WKWebViewConfigration`**に設定する**`WKPreferences`**の**`minimumFontSize`**が効かないケースがあったので調査＆備忘録。
&nbsp;

## WKWebView　の使い方

**`WKWebView`**の基本的な使い方に関しては [こちら](https://rc-code.info/ios/post-241/) にまとめております。
合わせてご覧ください。
&nbsp;

## WKPreferences　minimumFontSize　の設定方法

**`WKPreferences`**はWebビューの基本設定をカプセル化するオブジェクトです。（[公式ドキュメント](https://developer.apple.com/documentation/webkit/wkpreferences)）
このうち**`minimumFontSize`**は**ptサイズでフォントの最小サイズを決めるプロパティ**です。
まずは使い方を記載します。
&nbsp;

```swift


import UIKit
// ① WebKit の import
import WebKit

class ViewController: UIViewController {
    
	var webView: WKWebView!
		
	override func loadView() {
		
		// ② WKWebViewConfiguration の生成
		let webConfiguration = WKWebViewConfiguration()
		// ③ WKPreferences の生成
		let preferences = WKPreferences()
		// ④ WKPreferences の minimumFontSize プロパティに値を指定
		preferences.minimumFontSize = 100.0
		// ⑤ WKWebViewConfiguration に WKPreferences のインスタンスを設定
		webConfiguration.preferences = preferences
		// ⑥ WKWebView に Configuration を引き渡し initialize
		webView = WKWebView(frame: CGRect(x: 150, y: 200, width: 200, height: 20), configuration: webConfiguration)
		// ⑦ view に WKWebView を割り当て
		view = webView
	}
		
	override func viewDidLoad() {
		super.viewDidLoad()
		
		loadView()
		webView.load(URLRequest(url: URL(string: "https://www.apple.com/")!))
	}
}
```
&nbsp;

上記のように、まず**`WKPreferences`**のインスタンスを生成し、このプロパティである**`minimumFontSize`**に**最小サイズにしたいフォントサイズをpt換算**で指定します。
&nbsp;

そして**`WKPreferencesインスタンス`**を**`WKWebViewConfiguration`**にセットし、この**`WKWebViewConfiguration`**を**`WKWebView`**の設定として使います。
&nbsp;


## minimumFontSize　が効かないケース 

さて本題ですが、このWebViewで様々なサイトを見てみると、**`minimumFontSize`**を設定しているにも関わらず、**指定フォントサイズ以下なってしまう場合**が見受けられます。

検証した結果、この事象にはCSSの**`text-size-adjust`**というスタイルが影響していることが分かりました。
&nbsp;


### text-size-adjust　スタイルとは？

**`text-size-adjust`**　(ベンダープレフィックスだと**`-webkit-text-size-adjust`**)　は、一部のデバイスで使われるテキストの自動拡大アルゴリズムを制御するスタイルです。
対応していないブラウザーはこのプロパティを無視します。

一部のモバイル端末には、縦向き　(Portrate)　と横向き　(Landscape)　が切り替わった際に文字サイズを自動調整する機能があり、**`text-size-adjust`**はこの自動調整を制御します。
&nbsp;


### text-size-adjust　が設定されると　minimumFontSize　が効かなくなる

検証を行なった結果、**`text-size-adjust`によって縮小されたサイズは`minimumFontSize`によって制限されたフォントサイズよりも小さくなる**ことが分かりました。

念の為、その他のスタイル指定でフォントサイズの制限が無視されないか検証しています。
&nbsp;


## 検証内容

最下部 Playground の Resources ディレクトリに様々なスタイル定義によるフォントサイズ変更を含んだHTMLファイルを用意しました。
**`minimumFontSize`**を設定した WKWebViewにて、このHTMLをそれぞれ表示した結果、**`text-size-adjust`**を設定したHTMLのみ、**`minimumFontSize`**で指定した値よりフォントサイズが小さくなりました。
&nbsp;

下記画像が、**`minimumFontSize`**に**`100`**を設定し、上部テキストに様々なスタイル定義で**`40px`**相当のフォントサイズを指定した画像です。
下記テキストは比較用のプレーンなテキストです。

![通常スタイル適用画像](https://rc-code.info/wp-content/uploads/2019/01/basic.png)

見た通り、スタイルで指定された**`40px`**を無視し、**`minimumFontSize`**に指定されている**`100pt`**相当の大きさで表示されています。
&nbsp;

変わって次の画像が**`text-size-adjust`**にを指定した時の画像です。

![text-size-adjust適用画像](https://rc-code.info/wp-content/uploads/2019/01/adjust.png)

こちらの上部テキストでは、スタイルで指定された**`40px`**が無視され、**`minimumFontSize`**に指定されている**`100pt`**が適用されるはずですが、**`text-size-adjust`**に指定している**`10%`**が適用され、**`4px (40pxの10％)`**相当の大きさになっています。
&nbsp;


## まとめ

全ての要素・スタイルを検証できているわけではないので確実ではないですが、**`WKPreferences`**の**`minimumFontSize`**を指定しているのにフォントが想定以下のサイズになってしまうようであれば、**`text-size-adjust`**の設定を疑ってみるのが良いかもしれません。
&nbsp;
&nbsp;


## 検証Playground

[検証Playground Git](https://github.com/rickeycode/UINSamplePlaygrounds/tree/master/WKWebView/WKWebViewConfigration/MinimumFontSize)
&nbsp;

## 検証環境
**Mac:** 10.13.6
**XCode:** 10.1
**Swift:** 4.2.1
&nbsp;

## 参考ドキュメント

[WebKit](https://developer.apple.com/documentation/webkit)
[WKWebViewConfiguration](https://developer.apple.com/documentation/webkit/wkwebviewconfiguration)
[WKPreferences](https://developer.apple.com/documentation/webkit/wkpreferences)
[text-size-adjust](https://developer.mozilla.org/ja/docs/Web/CSS/text-size-adjust)
&nbsp;
&nbsp;