simple_formatの使い方

# simple_format
## 概要
[simple_format - リファレンス - - Railsドキュメント](http://railsdoc.com/references/simple_format)

- 文字列を `<p>` で括る
- 改行は `<br />` を付与
- 連続した改行は、 `</p><p>` を付与

## 使用例
### 使用しない場合
```ruby:#simple_formatを使用しない
<% text = "テキスト\nテキスト\n\nテキストテキスト" %>
<%= text %>
```
```html:出力結果
テキスト
テキスト

テキストテキスト
```
実際表示結果
<img width="268" alt="スクリーンショット 2018-02-26 0.24.39.png" src="https://qiita-image-store.s3.amazonaws.com/0/188887/3ebcb4f7-26bf-1241-35a3-d6902b0ce2b9.png">

### 使用した場合
```ruby:#simple_formatを使用する
<% text = "テキスト\nテキスト\n\nテキストテキスト" %>
<%= simple_format text %>
```
```html:出力結果
<p>テキスト
<br />テキスト</p>

<p>テキストテキスト</p>
```
表示結果
<img width="151" alt="スクリーンショット 2018-02-26 0.27.03.png" src="https://qiita-image-store.s3.amazonaws.com/0/188887/7b0daec8-dea8-b6dd-2ce2-9ef169d2933b.png">

概要にある通りpタグで括られ、改行は `<br />` に変換さえ
連続した改行は `</p><p>` が付与されている
## タグが埋め込まれている場合
注意しないといけないのがタグが埋め込まれている場合はエスケープされなくなってしまう。

### 使用しない場合
```ruby#simple_formatを使用しない（タグあり）
<% text = "<h1>テキスト\nテキスト\n\nテキストテキスト</h1>" %>
<%= text %>
```
```html:出力結果
&lt;h1&gt;テキスト
テキスト

テキストテキスト&lt;/h1&gt;
```
表示結果
<img width="361" alt="スクリーンショット 2018-02-26 0.38.30.png" src="https://qiita-image-store.s3.amazonaws.com/0/188887/2c6fbb8b-89f5-7fe1-5fa7-ba3a52cf264c.png">

### 使用した場合
```ruby#simple_formatを使用する（タグあり）
<% text = "<h1>テキスト\nテキスト\n\nテキストテキスト</h1>" %>
<%= simple_format text %>
```
```html:出力結果
<p><h1>テキスト
<br />テキスト</p>

<p>テキストテキスト</h1></p>
```
表示結果
<img width="261" alt="スクリーンショット 2018-02-26 0.41.51.png" src="https://qiita-image-store.s3.amazonaws.com/0/188887/ba6e1481-8d61-0933-761b-6ed9c7ab970d.png">

### エスケープされない原因
`simple_format` の[ソース](https://github.com/rails/rails/blob/0e50b7bdf4c0f789db37e22dc45c52b082f674b4/actionview/lib/action_view/helpers/text_helper.rb#L283)を見てみる

```ruby:#simple_format
def simple_format(text, html_options = {}, options = {})
  wrapper_tag = options.fetch(:wrapper_tag, :p)

  text = sanitize(text) if options.fetch(:sanitize, true)
  paragraphs = split_paragraphs(text)

  if paragraphs.empty?
    content_tag(wrapper_tag, nil, html_options)
  else
    paragraphs.map! { |paragraph|
      content_tag(wrapper_tag, raw(paragraph), html_options)
    }.join("\n\n").html_safe
  end
end
```

上記にある通り最後に `#html_safe` で処理されているためエスケープされなくなっている。
#### #sanitizeについて
最初にある `sanitize` で除去されそうだがデフォルトでは以下のタグは許可されている。

```
>> ActionView::Base.sanitized_allowed_tags
=> #<Set: {"strong", "em", "b", "i", "p", "code", "pre", "tt", "samp", "kbd", "var", "sub", "sup", "dfn", "cite", "big", "small", "address", "hr", "br", "div", "span", "h1", "h2", "h3", "h4", "h5", "h6", "ul", "ol", "li", "dl", "dt", "dd", "abbr", "acronym", "a", "img", "blockquote", "del", "ins"}>
```

なので上記以外の `<strike>` タグを指定してみると。

```
text
=> "<strike>テキスト\nテキスト\n\nテキストテキスト</strike>"

sanitize text
=> "テキスト\nテキスト\n\nテキストテキスト"
```

と除去されます。
### エスケープする対応方法
`#h` を使用する

```ruby:エスケープして#simple_formatを使用する
<% text = "<h1>テキスト\nテキスト\n\nテキストテキスト</h1>" %>
<%= simple_format h text %>
```
```html:出力結果
<p>&lt;h1&gt;テキスト
<br />テキスト</p>

<p>テキストテキスト&lt;/h1&gt;</p>
```
表示結果
<img width="182" alt="スクリーンショット 2018-02-26 23.09.05.png" src="https://qiita-image-store.s3.amazonaws.com/0/188887/9891bc0f-2fbd-982d-9139-e74a82f44c7c.png">