fix(web-component): disable-media-upload attribute

Author: LarsTheGlidingSquirrel

.yarn/cache/@serlo-editor-npm-0.24.0-6846c590e6-dc071e92e9.zip

@@ -65,22 +65,35 @@ export class EditorWebComponent extends HTMLElement {
     ]
   }
 
-  attributeChangedCallback(name: string, oldValue: string, newValue: string) {
-    if (name === 'initial-state' && oldValue !== newValue) {
-      this.initialState = JSON.parse(newValue) as InitialState
+  attributeChangedCallback(
+    name: string,
+    oldValue: string | null,
+    newValue: string | null
+  ) {
+    if (oldValue === newValue) return
+
+    if (name === 'initial-state') {
+      this.initialState =
+        newValue === null ? null : (JSON.parse(newValue) as InitialState)
     } else if (
       name === 'mode' &&
-      oldValue !== newValue &&
       (newValue === 'read' || newValue === 'write')
     ) {
       this.mode = newValue
-    } else if (name === 'editor-variant' && oldValue !== newValue) {
-      this.editorVariant = newValue as EditorVariant
-    } else if (name === 'plugins' && oldValue !== newValue) {
-      this.plugins = JSON.parse(newValue) as EditorPluginType[]
+    } else if (name === 'editor-variant') {
+      this.editorVariant =
+        newValue === null ? 'unknown' : (newValue as EditorVariant)
+    } else if (name === 'plugins') {
+      this.plugins =
+        newValue === null
+          ? defaultPlugins
+          : (JSON.parse(newValue) as EditorPluginType[])
     } else if (name === 'is-production-environment') {
       this.isProductionEnvironment = newValue === 'true'
-    } else if (name === 'language' && oldValue !== newValue) {
+    } else if (name === 'disable-media-upload') {
+      this.disableMediaUpload =
+        newValue === 'true' ? true : newValue === 'false' ? false : null
+    } else if (name === 'language') {
       // Validates the language attribute. Will need to keep this in sync with
       // the SupportedLanguage type, if we add more language support!
       const validatedLanguage = newValue === 'en' ? 'en' : 'de'
@@ -166,8 +179,14 @@ export class EditorWebComponent extends HTMLElement {
     return this._disableMediaUpload
   }
 
-  set disableMediaUpload(value: boolean) {
-    if (value) this.setAttribute('disable-media-upload', String(value))
+  set disableMediaUpload(value: boolean | null) {
+    this._disableMediaUpload = value
+    if (value === null) {
+      this.removeAttribute('disable-media-upload')
+    } else {
+      this.setAttribute('disable-media-upload', String(value))
+    }
+    this.mountReactComponent()
   }
 
   get language(): SupportedLanguage {
@@ -213,7 +232,6 @@ export class EditorWebComponent extends HTMLElement {
 
   mountReactComponent() {
     const initialStateAttr = this.getAttribute('initial-state')
-    const disableMediaUploadAttr = this.getAttribute('disable-media-upload')
 
     const initialState: InitialState = initialStateAttr
       ? (JSON.parse(initialStateAttr) as unknown as any)
@@ -240,7 +258,11 @@ export class EditorWebComponent extends HTMLElement {
                 initialState={this.initialState}
                 plugins={this.plugins}
                 isProductionEnvironment={this.isProductionEnvironment}
-                disableMediaUpload={Boolean(disableMediaUploadAttr)}
+                disableMediaUpload={
+                  this._disableMediaUpload === null
+                    ? undefined
+                    : this._disableMediaUpload
+                }
                 onChange={(newState) => {
                   this._currentState = newState
                   this.broadcastNewState(newState)

.yarn/cache/@serlo-editor-npm-0.26.0-bb60b8e32a-fc0337e89d.zip

@@ -5488,7 +5488,7 @@ __metadata:
     "@eslint/eslintrc": ^3.3.1
     "@eslint/js": ^9.23.0
     "@rollup/plugin-replace": ^6.0.1
-    "@serlo/editor": 0.24.0
+    "@serlo/editor": 0.26.0
     "@serlo/typescript-config": "workspace:*"
     "@types/react": ^18.0.25
     "@types/react-dom": ^18.3.1
@@ -5512,21 +5512,21 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@serlo/editor@npm:0.24.0":
-  version: 0.24.0
-  resolution: "@serlo/editor@npm:0.24.0"
+"@serlo/editor@npm:0.26.0":
+  version: 0.26.0
+  resolution: "@serlo/editor@npm:0.26.0"
   dependencies:
     "@open-iframe-resizer/react": 1.2.1
     "@serlo/katex-styles": 1.0.1
     "@vidstack/react": next
-    isomorphic-dompurify: ^2.19.0
+    isomorphic-dompurify: ^2.22.0
     lit: ^3.2.1
     motion: ^11.11.17
     react: ^18.2.0
     react-dom: ^18.3.1
     react-hot-toast: ^2.4.1
     react-resizable: ^3.0.5
-  checksum: dc071e92e96bc22691a5138eb9e7365a1270bf1c054d668857786f6f9918191cefa181e5141540b2014ca2a982becf1619ee7efbc521520a53f4ea9d6b45cc0f
+  checksum: fc0337e89dd0b447274ce9b0b395516fd77b5a1203820e8ed299eb9e439b881fd428c11ac1a4bcd136245b4204f1dc22c7e81e0a3a47a2e8d9843f2fc1e04a29
   languageName: node
   linkType: hard
 
@@ -8750,15 +8750,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"cssstyle@npm:^4.1.0":
-  version: 4.1.0
-  resolution: "cssstyle@npm:4.1.0"
-  dependencies:
-    rrweb-cssom: ^0.7.1
-  checksum: a8f5746430c42347e76dc830548f3a296882e42a90af188ae44e4c1a4131aec246b0b6c8562e3e6e4fa0ff14aeee5cd14a0e2fe5a7105dcf39f98eb70d16b634
-  languageName: node
-  linkType: hard
-
 "cssstyle@npm:^4.2.1":
   version: 4.3.0
   resolution: "cssstyle@npm:4.3.0"
@@ -9205,7 +9196,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"dompurify@npm:^3.2.3, dompurify@npm:^3.2.4":
+"dompurify@npm:^3.2.4":
   version: 3.2.4
   resolution: "dompurify@npm:3.2.4"
   dependencies:
@@ -11467,7 +11458,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"https-proxy-agent@npm:^7.0.5, https-proxy-agent@npm:^7.0.6":
+"https-proxy-agent@npm:^7.0.6":
   version: 7.0.6
   resolution: "https-proxy-agent@npm:7.0.6"
   dependencies:
@@ -12342,16 +12333,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"isomorphic-dompurify@npm:^2.19.0":
-  version: 2.19.0
-  resolution: "isomorphic-dompurify@npm:2.19.0"
-  dependencies:
-    dompurify: ^3.2.3
-    jsdom: ^25.0.1
-  checksum: 42fb8a4d5e88b51f0081993733d2babb9bf8793ef7ec0b1baf387fbaeab58f3b3f749d084222f13ed72018d6dbf4ffacc2e8335e63aaa204a01d4dd02ef59222
-  languageName: node
-  linkType: hard
-
 "isomorphic-dompurify@npm:^2.22.0":
   version: 2.22.0
   resolution: "isomorphic-dompurify@npm:2.22.0"
@@ -12515,40 +12496,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"jsdom@npm:^25.0.1":
-  version: 25.0.1
-  resolution: "jsdom@npm:25.0.1"
-  dependencies:
-    cssstyle: ^4.1.0
-    data-urls: ^5.0.0
-    decimal.js: ^10.4.3
-    form-data: ^4.0.0
-    html-encoding-sniffer: ^4.0.0
-    http-proxy-agent: ^7.0.2
-    https-proxy-agent: ^7.0.5
-    is-potential-custom-element-name: ^1.0.1
-    nwsapi: ^2.2.12
-    parse5: ^7.1.2
-    rrweb-cssom: ^0.7.1
-    saxes: ^6.0.0
-    symbol-tree: ^3.2.4
-    tough-cookie: ^5.0.0
-    w3c-xmlserializer: ^5.0.0
-    webidl-conversions: ^7.0.0
-    whatwg-encoding: ^3.1.1
-    whatwg-mimetype: ^4.0.0
-    whatwg-url: ^14.0.0
-    ws: ^8.18.0
-    xml-name-validator: ^5.0.0
-  peerDependencies:
-    canvas: ^2.11.2
-  peerDependenciesMeta:
-    canvas:
-      optional: true
-  checksum: b637d28445d570014195b3c77d06e54ef69d1f807eaf61388cb470e4d9227244e7fe2e0c32b6df03ac4fe35f746d7c721672d9136ecebb49d2e61a04ab9628e0
-  languageName: node
-  linkType: hard
-
 "jsdom@npm:^26.0.0":
   version: 26.0.0
   resolution: "jsdom@npm:26.0.0"
@@ -14522,13 +14469,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"nwsapi@npm:^2.2.12":
-  version: 2.2.16
-  resolution: "nwsapi@npm:2.2.16"
-  checksum: 467b36a74b7b8647d53fd61d05ca7d6c73a4a5d1b94ea84f770c03150b00ef46d38076cf8e708936246ae450c42a1f21e28e153023719784dc4d1a19b1737d47
-  languageName: node
-  linkType: hard
-
 "nwsapi@npm:^2.2.16":
   version: 2.2.19
   resolution: "nwsapi@npm:2.2.19"
@@ -14952,7 +14892,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"parse5@npm:^7.1.2, parse5@npm:^7.2.1":
+"parse5@npm:^7.2.1":
   version: 7.2.1
   resolution: "parse5@npm:7.2.1"
   dependencies:
@@ -16475,13 +16415,6 @@ react-mathquill@Entkenntnis/tmp-react-mathquill:
   languageName: node
   linkType: hard
 
-"rrweb-cssom@npm:^0.7.1":
-  version: 0.7.1
-  resolution: "rrweb-cssom@npm:0.7.1"
-  checksum: 62e410ddbaaba6abc196c3bbfa8de4952e0a134d9f2b454ee293039bf9931322d806e14d52ed122a5c2bd332a868b9da2e99358fb6232c33758b5ede86d992c8
-  languageName: node
-  linkType: hard
-
 "rrweb-cssom@npm:^0.8.0":
   version: 0.8.0
   resolution: "rrweb-cssom@npm:0.8.0"