RE: HTML5 readonly Spec 보강 요청

안녕하세요. 김영보 선생님.

답변이 늦어서 죄송합니다^^;

 

먼저 좋은 input 감사합니다~^^ 말씀하신 부분은 Browser의 상호호환성과 관련이
있는 것 같습니다. 좀더 명확히 확인 후에 HTML WG에 이야기를 하면 좋을 것
같습니다.

참고로 HTML WG에서 HTML5 표준에 대한 Test Cases를 준비하고 있는데 말씀하신
부분들에 대해서도 아마 Test Cases들이 추가되어 시험을 하는 것이 필요해
보입니다~

 

이원석 드림.

 

From: 김영보 [mailto:tonextday@gmail.com] 
Sent: Sunday, May 20, 2012 3:53 PM
To: public-html-ig-ko@w3.org
Subject: HTML5 readonly Spec 보강 요청

 

안녕하세요. 김영보입니다.

작은 사항이지만 가끔 혼동이 되어 HTML5 스펙 보강을 하면 어떨까 하고 적어
봅니다.

W3C 관계되시는 분은 검토/의견 수렴 후에 HTML5 워킹그룹에 요청을 해주시면
고맙겠습니다.

 

테스트에 사용한 브라우저

Chrome 19.0.1084.46 m, Firefox 12.0, IE 9.0.8112.16421, Opera 11.62, Safari
5.1.7(7534.57.2)

 

테스트 형태

<input id="id1" readonly />

<input id="id2" readonly='' />

<input id="id3" readonly='readonly' />

<input id="id4" readonly='false' />

<input id="id5" readonly=false />

 

HTML5에서 readonly attribute가 boolean attribute이므로 #id1과 같이
readonly만 작성한다.

하지만 '테스트에 사용한 브라우저' 모두 read only 상태가 되어 값을 입력할 수
없다.

 

또한 JavaScript로 아래와 같이 실행하면 모두 true를 반환한다.

for (var k = 1; k < 6; k++){

    var value = document.getElementById('id' + k).readOnly;

}

 

브라우저 제공 디버거로 보면 

<input id="id4" readonly='false' />, <input id="id5" readonly=false />

모두 readOnly: "true"로 설정되어 있다.

HTML Document에 작성한 값과 HTMLInputElement에 설정된 값이 다르다는 것이
혼동된다.

 

<input id="id6" />와 같이 readonly를 작성하지 않은 상태에서

document.getElementById('id6').readOnly = false를 실행하면 read only 상태가
된다.

 

즉, <input id="id5" readonly=false />,
document.getElementById('id6').readOnly = false 형태에서

HTML Docuement와 JavaScript의 readonly=false 기능이 반대가 되어 혼란된다.

 

{HTML5 Spec. Request}

<input id="id4" readonly='false' />, <input id="id5" readonly=false />를
read only 상태가 아닌 

값을 입력할 수 있는 상태로 하면 HTML Docuement와 JavaScript의
readonly=false를 

일관된 개념으로 사용할 수 있다.

 

-----------------

** Tab key에 따른 이동 및 커서 표시

 

Tab key를 치면 다음의 readonly HTMLInputElement로 이동하지만 cursor 표시가
일정하지 않다. 

Chrome, Opera, Safari: 커서가 보이지 않는다.

Firefox, IE: 커서가 보인다.

 

- 커서가 보이지 않으므로 커서의 위치를 파악할 수 없어 가시성이 떨어진다.

- 커서가 보이므로 입력 가능한 것으로 사용자가 생각할 수 있다.

  하지만 실제로 입력할 수 없어 혼동된다.

 

Mouse로 readonly HTMLInputElement를 click하면

Chrome, Opera, Safari: click이 되지 않는다.

Firefox, IE: click이 된다.

 

- click이 되므로 마우스의 위치를 파악할 수 있다.

- 입력 가능한 것으로 생각할 수 있지만 실제로 입력할 수 없다.     

- click이 안되므로 잘못 누른 것으로 생각하여 여러번 click할 수도 있다.

   일반 사용자들은 입력이 안되는 이유를 이해하지 못한다.

 

{HTML5 Spec. Request}

웹접근성과 HTML5 기준를 반영하여 Spec에 한 가지 형태를 명시했으면 좋겠다.

 

------------------

- 참고로 브라우저 제공 디버거로 보면 아래와 같이 변경된다.

Chrome, Safari:

<input type="text" id="id2" readonly />

<input type="text" id="id5" readonly="false" />

 

IE:

<input type="text" id="id1" readonly="" />

<input type="text" id="id2" readonly="" />

<input type="text" id="id3" readonly="" />

<input type="text" id="id4" readonly="" />

<input type="text" id="id5" readonly="" />

 

Firefox:

<input type="text" id="id1" readonly="" />

<input type="text" id="id5" readonly="false" />