다가오는 테마 컴포넌트 'use strict' 변경 - Discourse 업그레이드 후 테마 오류

현재 최신 커밋 레벨(105634435f)을 사용하고 있습니다. 저는 보통 일주일에 한 번 정도 Discourse를 업그레이드합니다. 평소에는 문제가 전혀 없었습니다. 그런데 이번에는 여러 테마 컴포넌트가 로드되지 않습니다. 여기서 '로드 실패’란 컴포넌트가 더 이상 화면에 표시되지 않는다는 뜻입니다. 관리 패널의 로그 기능에서는 이 문제와 관련이 있을 만한 이상한 내용을 찾지 못했습니다. 많은 오류들은 우발적인 것으로 보이며, 이미 꽤 오랜 기간 동안 발생해 왔습니다. 예를 들어 드물게 발생하는 MimeType 오류나 Google DNS 타임아웃 등이 있는데, 역시 드물게 발생하는 오류들입니다.

업그레이드 후 로드되지 않는 플러그인은 다음과 같습니다:

  • DiscoTOC
  • discourse gifs
  • Discourse Jitsi
  • Hamburger Theme Selector
  • Nav Links Component
  • Tag Icons

정상적으로 작동하는 플러그인은 다음 두 개뿐입니다:

  • Discourse Kanban
  • Easy Footer

더 많은 정보가 필요하시다면(필요할 것 같습니다) 기꺼이 제공하겠습니다. 안내해 주시면 감사하겠습니다. 이 게시글은 무언가 잘못되었다는 신호를 보내는 것이며, 아마도 최근 변경 사항과 관련이 있을 것입니다. 정보가 부족해서 죄송합니다…

또한, 다음과 같은 비엄격(non-strict) JavaScript 변수 정의는

xxx = 330;

대신

var xxx = 330;

을 사용해야 합니다. 그렇지 않으면 JS “미정의 변수” 오류가 발생합니다. 우리는 스크립트에서 이러한 모든 부분을 수정해야 했습니다.

네, 일부 테마 구성 요소에 문제가 있으며 수정 작업을 진행 중입니다.

@pmusaraj 정말 감사합니다.
행운을 빕니다

컴포넌트에서 엄격하게 정의되지 않은 JS 변수가 에러를 일으키는 이유를 아시나요? 이 것이 후처리(post-processing) 에러인가요? 여기에 변경된 부분이 있나요?

이 문제를 일으킨 변경 사항은 1시간 전에 되돌려졌으며, 사이트에 영향을 받았다면 최신 버전으로 업데이트해 주세요.

팔코가 말한 것에 덧붙이자면, 해당 변경 사항은 며칠 내에 다시 적용될 예정입니다. 다만, 다시 적용하기 전에 모든 공식 테마/컴포넌트가 해당 변경 사항과 호환되는지 확인하겠습니다. 따라서 공식 테마/컴포넌트에서 문제가 다시 발생하면, 업데이트를 통해 문제를 해결할 수 있습니다.

또한, 사이트에 사용자 지정/비공개 컴포넌트를 사용하는 사람들을 위해 테마/컴포넌트를 호환되도록 만드는 방법에 대한 게시글도 작성하겠습니다.

오늘 불편을 드려 죄송합니다.

저희 테마 중 하나(배너 테마)가 초기 형식으로 완전히 덮어쓰기되어, 우리가 했던 모든 변경 사항이 사라졌습니다. 해당 테마는 2018년 이후 업데이트가 없었습니다. 변경 사항을 되돌릴 수 있을까요?

음, 정말 이상하네요. 해당 커밋(Revert "FEATURE: Introduce theme/component QUnit tests (#12517)" (#12… · discourse/discourse@2b9ab3a · GitHub)을 포함하도록 인스턴스를 다시 업데이트하셨나요? '초기 형식’이라고 하셨는데, 이 표현이 정확히 무엇을 의미하시는지 조금 더 자세히 설명해 주실 수 있을까요? 테마의 JS/CSS에 로컬 변경 사항이 있었는데, 이제 그 모든 변경 사항이 사라졌다는 뜻인가요?

이것이 JS 변수 정의와 관련된 문제도 설명하는 건가요? 그렇다면 어떻게 설명하는 건가요?

이 문제가 롤백된 기능과 관련이 있다고 생각하지 않습니다. 몇 주 전에도 컴포넌트에서 동일한 상황이 발생했는데, 아마 포크 인디케이터 기능(플러그인을 다루므로 :roll_eyes: 아마도 이 역시 관련이 없을 것 같지만, 컴포넌트를 수정하기 위해 포크해야 했던 적이 있었습니다) 때문이었을 것입니다.

정말 이상하네요. 저희는 그런 문제가 전혀 없었거든요. 최신 버전에서 갑자기 발생했어요. 정확히 무슨 일이 일어나고 있는지 궁금하네요.

이 변경 사항은 테마의 “인라인” JS에도 영향을 미치는 복잡한 수정이었습니다. 해당 변경 사항은 되돌려졌으며, 재 배포되기 전 며칠 내에 다시 작업될 예정입니다. 자세한 내용은 FEATURE: Introduce theme/component QUnit tests - Pull Request #12517 - discourse/discourse - GitHub 에서 확인하실 수 있습니다.

네, 그 변경 사항이 테마에서 확인한 문제의 원인입니다. 무슨 일이 있었는지 설명하려면 테마 시스템에 대해 조금 자세히 말씀드릴 필요가 있습니다. Discourse 테마/컴포넌트에 JS를 추가하는 방법은 두 가지가 있습니다. 첫 번째 방법은 head_tag.html 파일 안에 <script type="text/discourse-plugin"> 태그를 사용하는 것이고, 두 번째 방법은 테마/컴포넌트 내부의 javascripts라는 이름의 디렉토리에 저장된 독립적인 JS 파일을 사용하는 것입니다.

오늘 제가 변경하기 전까지는, 해당 특수 스크립트 태그 내부의 JavaScript는 Ember CLI로 Discourse를 개발할 때 사용할 수 없는 Discourse 전역 변수에 의존하는 방식으로 처리되었습니다. 오늘 제가 적용한 변경 사항으로 인해, Discourse는 해당 태그 내부의 JS를 독립적인 파일에서 가져온 것처럼 처리하도록 만들었고, 이를 통해 Discourse 전역 변수를 사용하지 않도록 했습니다.

이제 스크립트 태그를 파일처럼 처리하는 것의 한 가지 "부수 효과"는, 태그 내부의 JavaScript에 이전에는 없던 "use strict" 지시문이 추가된다는 것입니다. 그리고 이 지시문이 여러분이 확인한 오류를 일으키고 있습니다:

제가 변경 사항을 다시 적용할 때 JS 태그가 다시 독립적인 파일처럼 처리되므로, 오늘 테마에서 적용한 모든 변경 사항을 유지하는 것을 권장합니다.

네, 코드에 그냥 게으른 정의(lazy definitions)가 몇 개 있었고, 정의를 엄격하게(strict) 바꾼 후에는 모두 정상적으로 작동합니다.

어쨌든, 이 부분을 더 자세히 설명해 주셔서 감사합니다. 다른 분들에게도 도움이 될 것 같습니다.

네, 모든 변경 사항이 사라졌습니다. CSS, JS 변경 사항은 물론 텍스트 변경 사항까지요 :sweat: 즉, 제 테마가 “Lorem ipsum dolor sit amet …” 같은 텍스트가 포함된 초기 상태로 되돌아간 겁니다. 어쨌든 백업을 사용할 예정이지만, 업그레이드 후에 이런 일이 발생한 것은 정말 이상했습니다.

@Pad_Pors 님, 안녕하세요.

문제가 이 내용과 더 관련이 있을 것 같습니다. :slightly_smiling_face:

다른 주제에서 작성하신 내용은 다음과 같습니다:

따라서 Discourse를 오랫동안 업데이트하지 않으셨을 것 같습니다.