실험적 PhotoSwipeLightbox 컴포넌트에서 예상치 못한 스케일링으로 원본 이미지의 비율이 깨짐

기여 UX
7

@davidb 최근 lightbox 컴포넌트에 대한 커밋 중 하나에 버그가 있는 것 같습니다. 이 버그는 제 PR이 병합된 후 discourse solved 및 기타 항목에서 컴포넌트가 시작되지 못하게 하는 문제를 일으키고 있습니다.

이 문제는 다음 커밋과 관련이 있을 수 있습니다.

FEATURE: allow quoting an image from the lightbox - Pull Request #36156 - discourse/discourse - GitHub.

이 PR이 실제로 해당 문제를 일으키는지 확신은 없습니다.

재현 방법은 지금 여기서 바로 할 수 있습니다.

예를 들어, onebox 인용문에서 [IMG_6085]를 클릭하거나, 링크를 열어 해당 페이지의 discourse solved 컴포넌트에서 답변의 이미지를 클릭하는 경우입니다. 원래 동작은 라이트박스가 열리는 것이었지만, 지금은 아무 일도 일어나지 않습니다.

콘솔에는 다음 오류가 표시됩니다: Uncaught TypeError: Cannot read properties of null (reading 'getAttribute')

관련된 코드는 다음과 같습니다:

// this ensures that cropped images (eg: grid) do not cause jittering when closing
data.thumbCropped = true;

data.src = data.src || el.getAttribute("data-large-src");
-> data.origSrc = imgEl.getAttribute("data-orig-src");
data.title = el.title || imgEl.alt || imgEl.title;

아마도 코드를 다음과 같이 변경하면 해결될 수 있습니다:

data.origSrc = imgEl?.getAttribute("data-orig-src") || el.getAttribute("data-orig-src") || null;

data.base62SHA1 =
    imgEl?.getAttribute("data-base62-sha1") || el.getAttribute("data-base62-sha1") || null;

data.targetWidth =
    el.getAttribute("data-target-width") || imgEl?.getAttribute("width") || null;
data.targetHeight =
    el.getAttribute("data-target-height") || imgEl?.getAttribute("height") || null;

PR 수정이 여기에 적용되었습니다:

2개의 좋아요