webkit은 왜 그럴까요? 저번에도 혼자 흐릿 처리 다르게 동작해서 한참을 헤매게 하더니만 이번에도 또 한참 헤매다가 겨우 이유를 알았네요.
로그인 페이지를 만들고 있었는데요. form 하위에 div가 있고 여기에 onclick 이벤트에 submit이라는 함수를 지정해서 이걸 클릭하면 버튼처럼 form 정보를 post로 전달하게 만들었습니다. 윈도우에서는 아무 문제가 없어서 잘 되는구나 하고 있었는데 아이폰으로 들어가서 해보니 안 됩니다? 어?
해당 함수 안에 쿠키값을 넣는 부분이 있는데 아이폰에서 아무리 해도 쿠키가 생성이 안 되어서 대체 무슨 문제인가 이리저리해보는데 어? 다른 함수에서 쿠키값을 넣으니까 들어갑니다? 아니 이게 무슨 소리야 함수 차별하는 것도 아니고 여기서는 되는데 왜 저기서는 안 되는 거야 하고 한참 혼란스러운 차에 아예 함수 자체를 지워보고 해보는데 form 내용을 전달하는지 페이지가 이동하네요? 함수가 없는데? 어?
함수가 없는데 이름을 submit이라고 해서 그런 건가? 싶어서 이름을 바꾸고 함수를 호출해 보니 바로 되는군요. 네, 지금까지 쿠키값이 지정이 안 되는 문제인가 했는데 애당초 함수 자체가 안 불리고 다른 함수가 불리고 있었네요. 애초에 완전 다른 곳에서 원인 찾겠다고 애먼 것만 보면서 어브버 하고 있었군요.
위의 예제 result를 보시면 윈도우에서는 submit과 submit2 모두 누르면 눌렸다고 경고창이 뜹니다. 아이폰에서는 submit2는 경고창이 뜨지만, submit은 아무 반응이 없습니다. 코드도 똑같고 이름만 다른데 동작은 완전 다르게 하네요.
구글에서 이래저래 찾아보는데 제가 못 찾는 건지 내용이 별로 없어서 정확한 이유는 잘 모르겠군요. 그냥 webkit은 html 사양 적용을 다르게 하고 있다. 정도로 이해하고 넘어가야겠네요.
참조
https://stackoverflow.com/questions/65241243/why-does-calling-a-function-named-submit-on-an-onclick-event-inside-a-form-b
https://stackoverflow.com/questions/6941483/onclick-vs-event-handler/21975639#21975639
https://html.spec.whatwg.org/multipage/webappapis.html#internal-raw-uncompiled-handler