[문서] 3-events-change-input 번역 충돌 해결

Author: taejinchoi-cbnu

2-ui/4-forms-controls/3-events-change-input/article.md

@@ -58,19 +58,11 @@
 
 `cut`, `copy`, `paste` 이벤트는 각각 값을 잘라내기·복사하기·붙여넣기 할 때 발생합니다.
 
-<<<<<<< HEAD
-세 이벤트는 [ClipboardEvent](https://www.w3.org/TR/clipboard-apis/#clipboard-event-interfaces) 클래스의 하위 클래스이며 복사하거나 붙여넣기 한 데이터에 접근할 수 있도록 해줍니다.
-=======
-They belong to [ClipboardEvent](https://www.w3.org/TR/clipboard-apis/#clipboard-event-interfaces) class and provide access to the data that is cut/copied/pasted.
->>>>>>> upstream/master
+세 이벤트는 [ClipboardEvent](https://www.w3.org/TR/clipboard-apis/#clipboard-event-interfaces) 클래스의 하위 클래스이며 잘라내기·복사하기·붙여넣기 된 데이터에 접근할 수 있도록 해줍니다.
 
 `input` 이벤트와는 달리 세 이벤트는 `event.preventDefault()`를 사용해 기본 동작을 막을 수 있습니다. 이렇게 하면 아무것도 복사·붙여넣기 할 수 없습니다.
 
-<<<<<<< HEAD
-예를 들어 아래 코드는 잘라내기·복사하기·붙여넣기 동작을 시도하면 모든 동작들이 중단되고 얼럿창을 통해 중단된 이벤트 이름을 보여줍니다.
-=======
-For instance, the code below prevents all `cut/copy/paste` events and shows the text we're trying to cut/copy/paste:
->>>>>>> upstream/master
+예를 들어 아래 코드는 잘라내기·복사하기·붙여넣기 동작을 시도하면 모든 동작이 중단되고 얼럿창을 통해 잘라내기·복사하기·붙여넣기를 시도하는 텍스트를 표시합니다.
 
 ```html autorun height=40 run
 <input type="text" id="input">
@@ -87,52 +79,39 @@ For instance, the code below prevents all `cut/copy/paste` events and shows the
 </script>
 ```
 
-<<<<<<< HEAD
-알아두세요! 텍스트뿐만 아니라 모든 것을 복사·붙여넣기 할 수 있습니다. 예를 들어 OS 파일 매니저에서 파일을 복사해 붙여넣을 수 있습니다.
+(붙여넣기는 얼럿창에 나오지만 잘라내기·복사하기는 '-'로 보입니다 - 옮긴이)
 
-클립보드에서 읽기·쓰기, 파일 등 다양한 데이터 타입에서 작동하는 메서드 목록 [명세서](https://www.w3.org/TR/clipboard-apis/#dfn-datatransfer)를 확인할 수 있습니다.
+알아두세요! 잘라내기·복사하기 이벤트 핸들러 내부에서 `event.clipboardData.getData(...)`를 호출하면 빈 문자열을 반환합니다. 엄밀히 말하면 아직 데이터가 클립보드에 들어가 있지 않기 때문입니다. 또한 `event.preventDefault()`를 사용하면 아예 복사조차 하지 못합니다.
 
-다만 클립보드는 '전역' OS 레벨입니다. `onclick` 이벤트 핸들러처럼 대부분의 브라우저는 안전을 위해 특정 사용자 동작의 범위에서만 클립보드의 읽기·쓰기에 대한 접근을 허용합니다. 
+따라서 위 예제는 `document.getSelection()`을 사용하여 선택한 텍스트를 가져옵니다. 문서 선택(document selection)에 대한 자세한 내용은 <info:selection-range>에서 다룹니다.
 
-또한 Firefox를 제외한 모든 브라우저에서 `dispatchEvent`를 사용하여 '커스텀' 클립보드 이벤트를 생성하는 것을 금지하고 있습니다.
-=======
-Please note: inside `cut` and `copy` event handlers a call to  `event.clipboardData.getData(...)` returns an empty string. That's because technically the data isn't in the clipboard yet. If we use `event.preventDefault()` it won't be copied at all.
+텍스트뿐만 아니라 모든 것을 복사하기·붙여넣기 할 수 있습니다. 예를 들어 OS 파일 매니저에서 파일을 복사해 붙여넣을 수 있습니다.
 
-So the example above uses `document.getSelection()` to get the selected text. You can find more details about document selection in the article <info:selection-range>.
+이는 `clipboardData`가 드래그 앤 드롭과 복사하기·붙여넣기에 공통으로 사용되는 `DataTransfer` 인터페이스를 구현하기 때문입니다. 이 인터페이스는 현재 논의 범위를 벗어나므로 자세히 다루지는 않지만 관련 메서드는 [DataTransfer 명세서](https://html.spec.whatwg.org/multipage/dnd.html#the-datatransfer-interface)에서 확인할 수 있습니다.
 
-It's possible to copy/paste not just text, but everything. For instance, we can copy a file in the OS file manager, and paste it.
+또한 클립보드에 접근하는 별도의 비동기 API인 `navigator.clipboard`도 있습니다 ([Firefox에서는 지원되지 않습니다](https://caniuse.com/async-clipboard)). 자세한 내용은 [클립보드 API 및 이벤트](https://www.w3.org/TR/clipboard-apis/) 명세서를 참조하면 됩니다.
 
-That's because `clipboardData` implements `DataTransfer` interface, commonly used for drag'n'drop and copy/pasting. It's a bit beyond our scope now, but you can find its methods in the [DataTransfer specification](https://html.spec.whatwg.org/multipage/dnd.html#the-datatransfer-interface).
 
-Also, there's an additional asynchronous API of accessing the clipboard: `navigator.clipboard`. More about it in the specification [Clipboard API and events](https://www.w3.org/TR/clipboard-apis/), [not supported by Firefox](https://caniuse.com/async-clipboard).
+### 안전 제한 사항
 
-### Safety restrictions
+클립보드는 '전역' OS 레벨입니다. 사용자는 여러 애플리케이션을 오가며 다양한 내용을 복사하기·붙여넣기 할 수 있는데 브라우저 페이지가 그 내용을 모두 볼 수 있어서는 안 됩니다.
 
-The clipboard is a "global" OS-level thing. A user may switch between various applications, copy/paste different things, and a browser page shouldn't see all that.
+그래서 대부분의 브라우저는 복사하기·붙여넣기 같은 특정 사용자 동작이 일어나는 범위 안에서만 클립보드 읽기·쓰기에 끊김없이 접근할 수 있도록 허용합니다.
 
-So most browsers allow seamless read/write access to the clipboard only in the scope of certain user actions, such as copying/pasting etc.
+Firefox를 제외한 모든 브라우저에서는 `dispatchEvent`로 '사용자 지정(custom)' 클립보드 이벤트를 생성하는 것이 금지되어 있습니다. 그런 이벤트를 보내는(dispatch) 데 성공하더라도 명세에는 이러한 '합성(synthetic)' 이벤트가 클립보드에 접근해서는 안 된다고 명확히 규정합니다.
 
-It's forbidden to generate "custom" clipboard events with `dispatchEvent` in all browsers except Firefox. And even if we manage to dispatch such event, the specification clearly states that such "synthetic" events must not provide access to the clipboard.
+이벤트 핸들러 안에서 `event.clipboardData`를 저장해두었다가 나중에 접근하려고 해도 마찬가지로 동작하지 않습니다.
 
-Even if someone decides to save `event.clipboardData` in an event handler, and then access it later -- it won't work.
+다시 말해 [event.clipboardData](https://www.w3.org/TR/clipboard-apis/#clipboardevent-clipboarddata)는 오직 사용자가 직접 발생시킨 이벤트의 핸들러 안에서만 동작합니다.
 
-To reiterate, [event.clipboardData](https://www.w3.org/TR/clipboard-apis/#clipboardevent-clipboarddata) works solely in the context of user-initiated event handlers.
-
-On the other hand, [navigator.clipboard](https://www.w3.org/TR/clipboard-apis/#h-navigator-clipboard) is the more recent API, meant for use in any context. It asks for user permission, if needed.
->>>>>>> upstream/master
+반면 [navigator.clipboard](https://www.w3.org/TR/clipboard-apis/#h-navigator-clipboard)는 더 최근에 등장한 API로 어떤 콘텍스트에서든 사용할 수 있도록 설계되었습니다. 필요한 경우 사용자에게 권한을 요청합니다.
 
 ## 요약
 
 데이터가 변경될 때 실행되는 다양한 이벤트를 정리해봅시다.
 
 | 이벤트 | 설명 | 특이사항 |
 |---------|----------|-------------|
-<<<<<<< HEAD
 | `change` | 값이 변경될 때 이벤트 발생 | 텍스트 입력의 경우 포커스를 잃을 때 실행 |
 | `input` | 텍스트가 입력될 때마다 이벤트 발생 | `change`와 달리 즉시 실행 |
-| `cut`, `copy`, `paste` | 잘라내기·복사하기·붙여넣기 할 때 이벤트 발생 | 브라우저 기본 동작을 막아 이벤트 실행을 막을 수 있음. `event.clipboardData` 프로퍼티를 사용하면 클립보드에 저장된 데이터를 읽고 쓸 수 있음 |
-=======
-| `change`| A value was changed. | For text inputs triggers on focus loss. |
-| `input` | For text inputs on every change. | Triggers immediately unlike `change`. |
-| `cut/copy/paste` | Cut/copy/paste actions. | The action can be prevented. The `event.clipboardData` property gives access to the clipboard. All browsers except Firefox also support `navigator.clipboard`. |
->>>>>>> upstream/master
+| `cut`, `copy`, `paste` | 잘라내기·복사하기·붙여넣기 할 때 이벤트 발생 | 브라우저 기본 동작을 막아 이벤트 실행을 막을 수 있음. <br> `event.clipboardData` 프로퍼티를 사용하면 클립보드에 저장된 데이터를 읽고 쓸 수 있음 <br> (Firefox를 제외한 모든 브라우저는 `navigator.clipboard` 도 지원) |