vulcan9 / jikji.editor

jik-ji 프로젝트 관리
Other
0 stars 0 forks source link

뷰어 미리보기시 이미지 유실 현상 #278

Open BaeKeun opened 1 year ago

BaeKeun commented 1 year ago

뷰어 옵션 설정>일반 뷰어인 경우 뷰어 미리보기에서 페이지 접히는 부분(양쪽 모서리 부분들)에 마우스 오버를 반복적으로 할 경우 이미지가 유실되는 현상이 있습니다. image

출판했을 경우에는 현상이 없는데, 뷰어 미리보기에서만 현상이 있습니다. 이해에 도움을 드리려 영상과 jik 파일을 전달드리겠습니다. image

vulcan9 commented 1 year ago

재연 동영상 https://user-images.githubusercontent.com/5111882/205524810-4a4851af-4353-4b68-99c5-cc0900bc0eca.mp4

vulcan9 commented 1 year ago

단위 테스트

  1. 미리보기 뷰어에 보여질 페이지 url 대신 단위 테스트하기 위한 페이지 URL을 전달하여 테스트함
  2. 정적 이미지를 하나 삽입함
  3. 영상과 같이 페이지 모서리 부분을 롤오버 반복함
  4. 이미지 사라짐 현상 발생

테스트에 사용된 page-sample.html

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=595, height=842">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title></title>
    <meta name="description" content="">
</head>
<body>
<div style="background-image: url(./상단네비1.png);
    background-size: contain;
    background-position: 0% 0%;
    width: 38px;
    height: 38px;"</div>
</body>
</html>
vulcan9 commented 1 year ago

원인

(테스트 1) Network > Disable cache 설정한 경우 (cache 사용하지 않는 경우)

image

결과: 요청 실패 후 다시 로드되는 리소스로 갱신됨

200 : '전송 성공'

image

(테스트 2) Network > Disable cache 설정하지 않은 경우 (cache 사용하는 경우)

image

결과: 요청 실패 후 이미지 사라짐

304 : 'Not modified 웹페이지에서 요청만하고 자신의 브라우저의 캐쉬를 사용하는 경우'

image

vulcan9 commented 1 year ago

결과

저작도구에서 증상을 회피하는 방법

image

cache 사용하지 않는 경우 주의할 점