diff --git a/app/assets/javascripts/autosave.js b/app/assets/javascripts/autosave.js index 5ab66acaf80..2e187eae17c 100644 --- a/app/assets/javascripts/autosave.js +++ b/app/assets/javascripts/autosave.js @@ -1,56 +1,57 @@ -/* eslint-disable no-param-reassign, consistent-return */ - +import { parseBoolean } from '~/lib/utils/common_utils'; import AccessorUtilities from './lib/utils/accessor'; export default class Autosave { constructor(field, key, fallbackKey, lockVersion) { this.field = field; - this.type = this.field.prop('type'); + this.type = this.field.getAttribute('type'); this.isLocalStorageAvailable = AccessorUtilities.canUseLocalStorage(); - if (key.join != null) { - key = key.join('/'); - } - this.key = `autosave/${key}`; + this.key = Array.isArray(key) ? `autosave/${key.join('/')}` : `autosave/${key}`; this.fallbackKey = fallbackKey; this.lockVersionKey = `${this.key}/lockVersion`; this.lockVersion = lockVersion; - this.field.data('autosave', this); this.restore(); - this.field.on('input', () => this.save()); + this.saveAction = this.save.bind(this); + // used by app/assets/javascripts/deprecated_notes.js + this.field.$autosave = this; + this.field.addEventListener('input', this.saveAction); } restore() { if (!this.isLocalStorageAvailable) return; - if (!this.field.length) return; const text = window.localStorage.getItem(this.key); const fallbackText = window.localStorage.getItem(this.fallbackKey); + const newValue = text || fallbackText; + if (newValue == null) return; + + let originalValue = this.field.value; if (this.type === 'checkbox') { - this.field.prop('checked', text || fallbackText); - } else if (text) { - this.field.val(text); - } else if (fallbackText) { - this.field.val(fallbackText); + originalValue = this.field.checked; + this.field.checked = parseBoolean(newValue); + } else { + this.field.value = newValue; } - this.field.trigger('input'); - // v-model does not update with jQuery trigger - // https://github.com/vuejs/vue/issues/2804#issuecomment-216968137 - const event = new Event('change', { bubbles: true, cancelable: false }); - const field = this.field.get(0); - if (field) { - field.dispatchEvent(event); - } + if (originalValue === newValue) return; + this.triggerInputEvents(); + } + + triggerInputEvents() { + // trigger events so @input, @change and v-model trigger in Vue components + const inputEvent = new Event('input', { bubbles: true, cancelable: false }); + const changeEvent = new Event('change', { bubbles: true, cancelable: false }); + this.field.dispatchEvent(inputEvent); + this.field.dispatchEvent(changeEvent); } getSavedLockVersion() { - if (!this.isLocalStorageAvailable) return; + if (!this.isLocalStorageAvailable) return undefined; return window.localStorage.getItem(this.lockVersionKey); } save() { - if (!this.field.length) return; - const value = this.type === 'checkbox' ? this.field.is(':checked') : this.field.val(); + const value = this.type === 'checkbox' ? this.field.checked : this.field.value; if (this.isLocalStorageAvailable && value) { if (this.fallbackKey) { @@ -66,7 +67,7 @@ export default class Autosave { } reset() { - if (!this.isLocalStorageAvailable) return; + if (!this.isLocalStorageAvailable) return undefined; window.localStorage.removeItem(this.lockVersionKey); window.localStorage.removeItem(this.fallbackKey); @@ -74,7 +75,7 @@ export default class Autosave { } dispose() { - // eslint-disable-next-line @gitlab/no-global-event-off - this.field.off('input'); + delete this.field.$autosave; + this.field.removeEventListener('input', this.saveAction); } } diff --git a/app/assets/javascripts/batch_comments/components/submit_dropdown.vue b/app/assets/javascripts/batch_comments/components/submit_dropdown.vue index acc3cbe10a0..ed0481e7a48 100644 --- a/app/assets/javascripts/batch_comments/components/submit_dropdown.vue +++ b/app/assets/javascripts/batch_comments/components/submit_dropdown.vue @@ -1,5 +1,4 @@ diff --git a/app/assets/javascripts/vue_shared/components/source_viewer/constants.js b/app/assets/javascripts/vue_shared/components/source_viewer/constants.js index a28460dd58e..f382ded90d7 100644 --- a/app/assets/javascripts/vue_shared/components/source_viewer/constants.js +++ b/app/assets/javascripts/vue_shared/components/source_viewer/constants.js @@ -140,3 +140,7 @@ export const BIDI_CHARS_CLASS_LIST = 'unicode-bidi has-tooltip'; export const BIDI_CHAR_TOOLTIP = 'Potentially unwanted character detected: Unicode BiDi Control'; export const HLJS_ON_AFTER_HIGHLIGHT = 'after:highlight'; + +// We fallback to highlighting these languages with Rouge, see the following issue for more detail: +// https://gitlab.com/gitlab-org/gitlab/-/issues/384375#note_1212752013 +export const LEGACY_FALLBACKS = ['python']; diff --git a/app/assets/javascripts/vue_shared/components/source_viewer/source_viewer.vue b/app/assets/javascripts/vue_shared/components/source_viewer/source_viewer.vue index 0cfee93ce5d..efafa67a733 100644 --- a/app/assets/javascripts/vue_shared/components/source_viewer/source_viewer.vue +++ b/app/assets/javascripts/vue_shared/components/source_viewer/source_viewer.vue @@ -11,6 +11,7 @@ import { EVENT_LABEL_FALLBACK, ROUGE_TO_HLJS_LANGUAGE_MAP, LINES_PER_CHUNK, + LEGACY_FALLBACKS, } from './constants'; import Chunk from './components/chunk.vue'; import { registerPlugins } from './plugins/index'; @@ -57,10 +58,11 @@ export default { }, unsupportedLanguage() { const supportedLanguages = Object.keys(languageLoader); - return ( + const unsupportedLanguage = !supportedLanguages.includes(this.language) && - !supportedLanguages.includes(this.blob.language?.toLowerCase()) - ); + !supportedLanguages.includes(this.blob.language?.toLowerCase()); + + return LEGACY_FALLBACKS.includes(this.language) || unsupportedLanguage; }, totalChunks() { return Object.keys(this.chunks).length; diff --git a/app/assets/javascripts/vue_shared/issuable/show/components/issuable_edit_form.vue b/app/assets/javascripts/vue_shared/issuable/show/components/issuable_edit_form.vue index 2fc1f935501..387fc5e0d1c 100644 --- a/app/assets/javascripts/vue_shared/issuable/show/components/issuable_edit_form.vue +++ b/app/assets/javascripts/vue_shared/issuable/show/components/issuable_edit_form.vue @@ -1,6 +1,5 @@