No OneTemporary
Actions

Authored By

Unknown

Size

33 KB

Referenced Files

None

Subscribers

None

View Options

	diff --git a/src/components/post_status_form/post_status_form.vue b/src/components/post_status_form/post_status_form.vue
	index 8976ee8088..648cfaa13a 100644
	--- a/src/components/post_status_form/post_status_form.vue
	+++ b/src/components/post_status_form/post_status_form.vue
	@@ -1,453 +1,452 @@
	<template>
	<div
	v-if="initialized"
	ref="form"
	class="post-status-form"
	>
	<form
	autocomplete="off"
	@submit.prevent
	@dragover.prevent="fileDrag"
	>
	<div class="form-group">
	<div
	v-if="!currentUser.locked && newStatus.visibility == 'private' && !disableLockWarning"
	class="visibility-notice notice-dismissible"
	>
	<i18n-t
	keypath="post_status.account_not_locked_warning"
	tag="p"
	class=""
	scope="global"
	>
	<button
	class="button-unstyled -link"
	@click="openProfileTab"
	>
	{{ $t('post_status.account_not_locked_warning_link') }}
	</button>
	</i18n-t>
	</div>
	<p
	v-if="!hideScopeNotice && newStatus.visibility === 'public'"
	class="visibility-notice notice-dismissible"
	>
	<span>{{ $t('post_status.scope_notice.public') }}</span>
	<button
	class="button-unstyled fa-scale-110 fa-old-padding dismiss"
	:title="$t('post_status.scope_notice_dismiss')"
	@click.prevent="dismissScopeNotice()"
	>
	<FAIcon icon="times" />
	</button>
	</p>
	<p
	v-else-if="!hideScopeNotice && newStatus.visibility === 'unlisted'"
	class="visibility-notice notice-dismissible"
	>
	<span>{{ $t('post_status.scope_notice.unlisted') }}</span>
	<button
	class="button-unstyled fa-scale-110 fa-old-padding dismiss"
	:title="$t('post_status.scope_notice_dismiss')"
	@click.prevent="dismissScopeNotice()"
	>
	<FAIcon icon="times" />
	</button>
	</p>
	<p
	v-else-if="!hideScopeNotice && newStatus.visibility === 'private' && currentUser.locked"
	class="visibility-notice notice-dismissible"
	>
	<span>{{ $t('post_status.scope_notice.private') }}</span>
	<button
	class="button-unstyled fa-scale-110 fa-old-padding dismiss"
	:title="$t('post_status.scope_notice_dismiss')"
	@click.prevent="dismissScopeNotice()"
	>
	<FAIcon icon="times" />
	</button>
	</p>
	<p
	v-else-if="!hideScopeNotice && newStatus.visibility === 'direct'"
	class="visibility-notice notice-dismissible"
	>
	<span v-if="safeDMEnabled">{{ $t('post_status.direct_warning_to_first_only') }}</span>
	<span v-else>{{ $t('post_status.direct_warning_to_all') }}</span>
	</p>
	<div
	v-if="isEdit"
	class="visibility-notice edit-warning"
	>
	<p>{{ $t('post_status.edit_remote_warning') }}</p>
	<p>{{ $t('post_status.edit_unsupported_warning') }}</p>
	</div>
	<div
	v-if="!disablePreview"
	class="preview-heading"
	>
	<button
	class="button-unstyled preview-toggle faint"
	@click.stop.prevent="togglePreview"
	>
	{{ $t('post_status.preview') }}
	<FAIcon :icon="showPreview ? 'chevron-left' : 'chevron-right'" />
	</button>
	<div
	v-show="previewLoading"
	class="preview-spinner"
	>
	<FAIcon
	class="fa-old-padding"
	spin
	icon="circle-notch"
	/>
	</div>
	<div
	v-if="quotable"
	role="radiogroup"
	class="reply-or-quote-selector"
	>
	<Checkbox
	v-model="quoteThreadToggled"
	:disabled="quoteFormVisible"
	radio
	>
	{{ $t('post_status.quote_option') }}
	</Checkbox>
	<Checkbox
	:model-value="!quoteThreadToggled"
	:disabled="quoteFormVisible"
	@update:model-value="e => quoteThreadToggled = !e"
	radio
	>
	{{ $t('post_status.reply_option') }}
	</Checkbox>
	</div>
	</div>
	<div
	v-if="showPreview"
	class="preview-container"
	>
	<div
	v-if="!preview"
	class="preview-status"
	>
	{{ $t('general.loading') }}
	</div>
	<div
	v-else-if="preview.error"
	class="preview-status preview-error"
	>
	{{ preview.error }}
	</div>
	<StatusContent
	v-else
	:status="preview"
	class="preview-status"
	/>
	</div>
	<div class="input inputs-wrapper">
	<EmojiInput
	v-if="!disableSubject && (newStatus.spoilerText \|\| alwaysShowSubject)"
	v-model="newStatus.spoilerText"
	enable-emoji-picker
	:suggest="emojiSuggestor"
	class="input form-control subject-input unstyled"
	>
	<template #default="inputProps">
	<input
	v-model="newStatus.spoilerText"
	type="text"
	:placeholder="$t('post_status.content_warning')"
	:disabled="posting && !optimisticPosting"
	:title="$t('post_status.content_warning')"
	v-bind="propsToNative(inputProps)"
	size="1"
	class="input form-post-subject unstyled"
	>
	</template>
	</EmojiInput>
	<input
	v-if="mentionsLine"
	:value="mentionsLineReadOnly ? mentionsString : newStatus.mentionsLine"
	type="text"
	:placeholder="$t('post_status.mentions_line')"
	:title="$t('post_status.mentions_line')"
	:disabled="mentionsLineReadOnly \|\| (posting && !optimisticPosting)"
	size="1"
	class="input mentions-input form-post-mentions unstyled"
	@change="onMentionsLineUpdate"
	>
	<EmojiInput
	ref="emoji-input"
	v-model="newStatus.status"
	:suggest="emojiUserSuggestor"
	:placement="emojiPickerPlacement"
	class="input form-control main-input unstyled"
	enable-sticker-picker
	enable-emoji-picker
	:newline-on-ctrl-enter="submitOnEnter"
	@input="onEmojiInputInput"
	@sticker-uploaded="addMediaFile"
	@sticker-upload-failed="uploadFailed"
	@shown="handleEmojiInputShow"
	>
	<template #default="inputProps">
	<textarea
	ref="textarea"
	v-model="newStatus.status"
	:placeholder="placeholder \|\| $t('post_status.default')"
	:title="$t('post_status.post_content')"
	rows="1"
	cols="1"
	:disabled="posting && !optimisticPosting"
	class="input form-post-body"
	:class="{ 'scrollable-form': !!maxHeight }"
	v-bind="propsToNative(inputProps)"
	@keydown.exact.enter="submitOnEnter && postStatus($event)"
	@keydown.meta.enter="postStatus($event, newStatus)"
	@keydown.ctrl.enter="!submitOnEnter && postStatus($event)"
	@input="resize"
	@compositionupdate="resize"
	@paste="paste"
	/>
	<p
	v-if="hasStatusLengthLimit"
	class="character-counter faint"
	:class="{ error: isOverLengthLimit }"
	>
	{{ charactersLeft }}
	</p>
	</template>
	</EmojiInput>
	</div>
	<div
	v-if="!disableScopeSelector"
	class="visibility-tray"
	>
	<scope-selector
	v-if="!disableVisibilitySelector"
	ref="scopeSelector"
	:show-all="showAllScopes"
	:user-default="userDefaultScope"
	:original-scope="repliedStatus?.visibility"
	:initial-scope="newStatus.visibility"
	@change="changeVis"
	/>

	<div
	v-if="postFormats.length > 1"
	class="text-format"
	>
	<Select
	v-model="newStatus.contentType"
	class="input form-control unstyled"
	:aria-label="$t('post_status.content_type_selection')"
	unstyled
	>
	<option
	v-for="postFormat in postFormats"
	:key="postFormat"
	:value="postFormat"
	>
	{{ $t(`post_status.content_type["${postFormat}"]`) }}
	</option>
	</Select>
	</div>
	<div
	v-if="postFormats.length === 1 && postFormats[0] !== 'text/plain'"
	class="text-format"
	>
	<span class="only-format">
	{{ $t(`post_status.content_type["${postFormats[0]}"]`) }}
	</span>
	</div>
	</div>
	</div>
	<PollForm
	v-if="pollsAvailable"
	ref="pollForm"
	v-model="newStatus.poll"
	:visible="pollFormVisible"
	/>
	<QuoteForm
	v-if="quotingAvailable"
	:id="newStatus.quote?.id"
	ref="quoteForm"
	:visible="quoteFormVisible"
	:url="newStatus.quote?.url"
	@update:url="url => newStatus.quote.url = url"
	@update:id="id => newStatus.quote.id = id"
	/>
	<span
	v-if="!disableDraft && shouldAutoSaveDraft"
	class="auto-save-status"
	>
	{{ autoSaveState }}
	</span>
	<div
	ref="bottom"
	class="form-bottom"
	>
	<div class="form-bottom-left">
	<media-upload
	ref="mediaUpload"
	class="bottom-left-button media-upload-icon"
	:drop-files="dropFiles"
	:disabled="uploadFileLimitReached"
	@uploading="startedUploadingFiles"
	@uploaded="addMediaFile"
	@upload-failed="uploadFailed"
	@all-uploaded="finishedUploadingFiles"
	/>
	<button
	v-if="pollsAvailable"
	class="bottom-left-button poll-icon button-unstyled"
	:class="{ toggled: pollFormVisible }"
	:title="$t('polls.add_poll')"
	@click="togglePollForm"
	>
	<FAIcon icon="poll-h" />
	</button>
	<button
	v-if="quotingAvailable"
	class="bottom-left-button quote-icon button-unstyled"
	:disabled="quoteThreadToggled"
	:class="{ toggled: quoteFormVisible }"
	:title="$t('tool_tip.add_quote')"
	@click="toggleQuoteForm"
	>
	<FAIcon icon="quote-right" />
	</button>
	</div>
	<div class="btn-group post-button-group">
	<button
	class="btn button-default post-button"
	:disabled="isOverLengthLimit \|\| posting \|\| uploadingFiles \|\| disableSubmit"
	@click.stop.prevent="postStatus($event)"
	>
	<template v-if="posting">
	{{ $t('post_status.posting') }}
	</template>
	<template v-else>
	{{ $t('post_status.post') }}
	</template>
	</button>
	<Popover
	v-if="!hideExtraActions"
	trigger="click"
	placement="bottom"
	:offset="{ y: 5 }"
	normal-button
	- :aria-label="$t('post_status.more_post_actions')"
	+ :title="$t('post_status.more_post_actions')"
	>
	<template #trigger>
	<FAIcon
	class="fa-scale-110 fa-old-padding"
	icon="chevron-down"
	/>
	</template>
	<template #content="{close}">
	<div
	class="dropdown-menu"
	role="menu"
	>
	<div
	class="menu-item dropdown-item"
	- :class="{ disabled: !safeToSaveDraft }"
	+ role="menuitem"
	>
	<button
	v-if="!hideDraft \|\| !disableDraft"
	class="main-button"
	- role="menu"
	:disabled="!safeToSaveDraft"
	@click.prevent="saveDraft"
	@click="close"
	>
	<template v-if="closeable">
	{{ $t('post_status.save_to_drafts_and_close_button') }}
	</template>
	<template v-else>
	{{ $t('post_status.save_to_drafts_button') }}
	</template>
	</button>
	</div>
	</div>
	</template>
	</Popover>
	</div>
	</div>
	<small
	v-if="chatView"
	class="keyboard-enter-hint faint"
	>
	<i v-if="submitOnEnter">
	{{ $t('post_status.enter_submits') }}
	</i>
	<i v-else>
	{{ $t('post_status.enter_newline') }}
	</i>
	</small>
	<div
	v-show="showDropIcon !== 'hide'"
	:style="{ animation: showDropIcon === 'show' ? 'fade-in 0.25s' : 'fade-out 0.5s' }"
	class="drop-indicator"
	@dragleave="fileDragStop"
	@drop.stop="fileDrop"
	>
	<FAIcon :icon="uploadFileLimitReached ? 'ban' : 'upload'" />
	</div>
	<div
	v-if="error"
	class="alert error -dismissible"
	>
	<span>
	{{ error }}
	</span>
	<button
	class="button-unstyled"
	@click="clearError"
	>
	<FAIcon
	class="fa-scale-110 fa-old-padding"
	icon="times"
	/>
	</button>
	</div>
	<Gallery
	v-if="newStatus.files && newStatus.files.length > 0"
	class="attachments"
	:grid="true"
	:nsfw="false"
	:attachments="newStatus.files"
	:descriptions="newStatus.mediaDescriptions"
	:set-media="() => setMedia()"
	:editable="true"
	:edit-attachment="editAttachment"
	:remove-attachment="removeMediaFile"
	:shift-up-attachment="newStatus.files.length > 1 && shiftUpMediaFile"
	:shift-dn-attachment="newStatus.files.length > 1 && shiftDnMediaFile"
	@play="$emit('mediaplay', 'newStatus')"
	@pause="$emit('mediapause', 'newStatus')"
	:aria-label="$t('status.attachments')"
	/>
	<div
	v-if="newStatus.files.length > 0 && !disableSensitivityCheckbox"
	class="upload_settings"
	>
	<Checkbox v-model="newStatus.nsfw">
	{{ $t('post_status.attachments_sensitive') }}
	</Checkbox>
	</div>
	</form>
	<DraftCloser
	ref="draftCloser"
	@save="saveAndCloseDraft"
	@discard="discardAndCloseDraft"
	/>
	</div>
	</template>

	<script src="./post_status_form.js"></script>

	<style src="./post_status_form.scss" lang="scss"></style>
	diff --git a/test/unit/specs/components/post_status_form.spec.js b/test/unit/specs/components/post_status_form.spec.js
	index 45a6bea22d..4f3106cd3d 100644
	--- a/test/unit/specs/components/post_status_form.spec.js
	+++ b/test/unit/specs/components/post_status_form.spec.js
	@@ -1,539 +1,541 @@
	import { createTestingPinia } from '@pinia/testing'
	import { flushPromises, mount } from '@vue/test-utils'
	import { setActivePinia } from 'pinia'
	import { $t, mountOpts, waitForEvent } from 'test/fixtures/setup_test.js'
	import { vi } from 'vitest'
	import { nextTick } from 'vue'

	import PostStatusForm from 'src/components/post_status_form/post_status_form.vue'

	import { useDraftsStore } from 'src/stores/drafts.js'
	import { useInstanceCapabilitiesStore } from 'src/stores/instance_capabilities.js'
	import { useMergedConfigStore } from 'src/stores/merged_config.js'
	import { useStatusesStore } from 'src/stores/statuses.js'
	import { useUsersStore } from 'src/stores/users.js'

	const autoSaveOrNot = (caseFn, caseTitle, runFn) => {
	caseFn(`${caseTitle} with auto-save`, function () {
	return runFn.bind(this)(true)
	})

	caseFn(`${caseTitle} with no auto-save`, function () {
	return runFn.bind(this)(false)
	})
	}

	const saveManually = async (wrapper) => {
	const morePostActions = wrapper.findByText(
	'button',
	$t('post_status.more_post_actions'),
	)
	+ console.log(morePostActions)
	await morePostActions.trigger('click')

	const btn = wrapper.findByText(
	- 'button',
	+ '.menu-item button',
	$t('post_status.save_to_drafts_button'),
	)
	+ console.log(btn)
	await btn.trigger('click')
	}

	const waitSaveTime = 4000

	const currentUser = {
	id: 'current-user',
	default_scope: 'public',
	locked: false,
	}

	const repliedUser = {
	id: 'replied-user',
	screen_name: 'replied',
	}

	const repliedStatus = {
	id: 'status-1',
	visibility: 'public',
	user: repliedUser,
	}

	const repliedStatus2 = {
	id: 'status-2',
	visibility: 'private',
	summary: 'subject',
	user: repliedUser,
	}

	describe('PostStatusForm', () => {
	describe('Basic functionality', () => {
	beforeEach(() => {
	vi.useFakeTimers()
	setActivePinia(createTestingPinia())
	useUsersStore().currentUser = currentUser
	useStatusesStore().allStatuses = new Map([
	[repliedStatus.id, repliedStatus],
	])
	})

	afterEach(() => {
	vi.useRealTimers()
	})

	it('Clean empty initial state', () => {
	const wrapper = mount(PostStatusForm, mountOpts())

	expect(wrapper.vm.statusType).to.equal('new')
	expect(wrapper.vm.newStatus.spoilerText).to.eql('')
	expect(wrapper.vm.newStatus.mentions).to.eql('')
	expect(wrapper.vm.newStatus.status).to.eql('')
	})

	it('Reset cleans form to pristine state equal to state form was when created', () => {
	const wrapper = mount(PostStatusForm, mountOpts())

	const initial = { ...wrapper.vm.newStatus }
	wrapper.vm.clearStatus()

	expect(wrapper.vm.newStatus).to.eql(initial)
	})

	it('Initializes a reply form', () => {
	const wrapper = mount(
	PostStatusForm,
	mountOpts({
	props: {
	repliedStatus: repliedStatus,
	},
	}),
	)

	useInstanceCapabilitiesStore().quotingAvailable = true

	expect(wrapper.vm.statusType).to.equal('reply')
	expect(wrapper.vm.isReply).to.equal(true)
	expect(wrapper.vm.refId).to.equal('status-1')
	expect(wrapper.vm.quotable).to.equal(true)
	expect(wrapper.vm.inReplyToStatusId).to.equal('status-1')
	expect(wrapper.vm.newStatus.quote).to.be.null
	expect(wrapper.vm.newStatus.poll).to.be.null
	expect(wrapper.vm.newStatus.spoilerText).to.eql('')
	expect(wrapper.vm.newStatus.mentions).to.eql('@replied')
	expect(wrapper.vm.newStatus.status).to.eql('@replied ')
	expect(wrapper.vm.newStatus.visibility).to.eql('public')
	})

	it('Copies scope and subject line, disables quoting for locked posts', () => {
	const wrapper = mount(
	PostStatusForm,
	mountOpts({
	props: {
	repliedStatus: repliedStatus2,
	},
	}),
	)

	useInstanceCapabilitiesStore().quotingAvailable = true

	expect(wrapper.vm.statusType).to.equal('reply')
	expect(wrapper.vm.isReply).to.equal(true)
	expect(wrapper.vm.quotable).to.equal(false)
	expect(wrapper.vm.newStatus.quote).to.be.null
	expect(wrapper.vm.newStatus.poll).to.be.null
	expect(wrapper.vm.newStatus.spoilerText).to.eql('re: subject')
	expect(wrapper.vm.newStatus.mentions).to.eql('@replied')
	expect(wrapper.vm.newStatus.status).to.eql('@replied ')
	expect(wrapper.vm.newStatus.visibility).to.eql('private')

	expect(wrapper.vm.postingOptions.status).to.eql('@replied ')
	expect(wrapper.vm.postingOptions.spoilerText).to.eql('re: subject')
	expect(wrapper.vm.postingOptions.visibility).to.eql('private')
	expect(wrapper.vm.postingOptions.sensitive).to.eql(false)
	expect(wrapper.vm.postingOptions.media).to.eql([])
	expect(wrapper.vm.postingOptions.inReplyToStatusId).to.eql('status-2')
	expect(wrapper.vm.postingOptions.quoteId).to.be.null
	expect(wrapper.vm.postingOptions.contentType).to.eql('text/plain')
	expect(wrapper.vm.postingOptions.poll).to.be.null
	})

	it('Forces direct mode when replying to a DM, mastodon style subject handling', () => {
	// We need to initialize pinia first which is happening here...
	const options = mountOpts({
	props: {
	repliedStatus: { ...repliedStatus2, visibility: 'direct' },
	},
	})

	// ...set our settings...
	useMergedConfigStore().mergedConfig = {
	...useMergedConfigStore().mergedConfig,
	subjectLineBehavior: 'masto',
	}

	// ...and only then mount our component
	const wrapper = mount(PostStatusForm, options)

	// Otherwise we get multiple instances of pinia that don't talk to each other

	expect(wrapper.vm.statusType).to.equal('reply')
	expect(wrapper.vm.isReply).to.equal(true)
	expect(wrapper.vm.quotable).to.equal(false)
	expect(wrapper.vm.newStatus.quote).to.be.null
	expect(wrapper.vm.newStatus.poll).to.be.null
	expect(wrapper.vm.newStatus.spoilerText).to.eql('subject')
	expect(wrapper.vm.newStatus.mentions).to.eql('@replied')
	expect(wrapper.vm.newStatus.status).to.eql('@replied ')
	expect(wrapper.vm.newStatus.visibility).to.eql('direct')
	})

	it('Sets status to statusText without mentions if mentions line is enabled', () => {
	const wrapper = mount(
	PostStatusForm,
	mountOpts({
	props: {
	repliedStatus: repliedStatus2,
	statusText: 'testing',
	mentionsLine: true,
	},
	}),
	)

	expect(wrapper.vm.statusType).to.equal('reply')
	expect(wrapper.vm.isReply).to.equal(true)
	expect(wrapper.vm.newStatus.mentions).to.eql('@replied')
	expect(wrapper.vm.newStatus.status).to.eql('testing')
	})

	it('Sets mention when asked for it', () => {
	const wrapper = mount(
	PostStatusForm,
	mountOpts({
	props: {
	profileMention: repliedUser,
	},
	}),
	)

	expect(wrapper.vm.statusType).to.equal('mention')
	expect(wrapper.vm.isReply).to.equal(false)
	expect(wrapper.vm.newStatus.mentions).to.eql('@replied')
	expect(wrapper.vm.newStatus.status).to.eql('@replied ')
	})

	it('Initializes quote when reply/quote toggled to quote', () => {
	const wrapper = mount(
	PostStatusForm,
	mountOpts({
	props: {
	repliedStatus: repliedStatus2,
	},
	}),
	)

	expect(wrapper.vm.statusType).to.equal('reply')
	expect(wrapper.vm.isReply).to.equal(true)

	wrapper.vm.quoteThreadToggled = true

	expect(wrapper.vm.newStatus.quote).to.eql({
	thread: true,
	id: 'status-2',
	})
	})

	it('Resets quote when reply/quote toggled to reply', () => {
	const wrapper = mount(
	PostStatusForm,
	mountOpts({
	props: {
	repliedStatus: repliedStatus2,
	},
	}),
	)

	expect(wrapper.vm.statusType).to.equal('reply')
	expect(wrapper.vm.isReply).to.equal(true)

	wrapper.vm.quoteThreadToggled = true
	wrapper.vm.quoteThreadToggled = false

	expect(wrapper.vm.newStatus.quote).to.be.null
	})

	it('Initializes and reset quote when toggling quote attachment', () => {
	const wrapper = mount(
	PostStatusForm,
	mountOpts({
	props: {
	repliedStatus: repliedStatus2,
	},
	}),
	)

	expect(wrapper.vm.statusType).to.equal('reply')
	expect(wrapper.vm.isReply).to.equal(true)

	wrapper.vm.toggleQuoteForm()
	expect(wrapper.vm.newStatus.quote).to.eql({
	thread: false,
	id: null,
	url: '',
	})
	wrapper.vm.toggleQuoteForm()
	expect(wrapper.vm.newStatus.quote).to.be.null
	})

	it('Status editing', () => {
	const wrapper = mount(
	PostStatusForm,
	mountOpts({
	props: {
	statusId: 'edited',
	statusText: 'text',
	statusSubject: 'heading',
	statusIsSensitive: true,
	statusPoll: {},
	statusQuote: {},
	statusFiles: [],
	statusMediaDescriptions: {},
	statusVisibility: 'unlisted',
	statusContentType: 'text/markdown',
	},
	}),
	)

	expect(wrapper.vm.statusType).to.equal('edit')
	expect(wrapper.vm.isReply).to.equal(false) // edits don't support changing reply-to so it's pretty much ignored
	expect(wrapper.vm.isEdit).to.equal(true)
	expect(wrapper.vm.newStatus.quote).to.eql({})
	expect(wrapper.vm.newStatus.poll).to.eql({})
	expect(wrapper.vm.newStatus.spoilerText).to.eql('heading')
	expect(wrapper.vm.newStatus.mentions).to.eql('')
	expect(wrapper.vm.newStatus.status).to.eql('text')
	expect(wrapper.vm.newStatus.visibility).to.eql('unlisted')
	expect(wrapper.vm.newStatus.contentType).to.eql('text/markdown')
	expect(wrapper.vm.newStatus.nsfw).to.equal(true)
	expect(wrapper.vm.newStatus.files).to.eql([])
	})

	it('Posting should reset idempotency key', async () => {
	vi.setSystemTime(new Date(2027, 1, 1, 13))
	const wrapper = mount(PostStatusForm, mountOpts())
	const oldIdempotency = wrapper.vm.idempotencyKey

	vi.setSystemTime(new Date(2028, 1, 1, 13))

	wrapper.vm.newStatus.status = 'Testing'
	await wrapper.vm.postStatus()

	expect(wrapper.vm.idempotencyKey).to.not.eql(oldIdempotency)
	})
	})

	describe('Attachments', () => {
	beforeEach(() => {
	vi.useFakeTimers()
	setActivePinia(createTestingPinia())
	useUsersStore().currentUser = currentUser
	useStatusesStore().allStatuses = new Map([
	[repliedStatus.id, repliedStatus],
	])
	})

	afterEach(() => {
	vi.useRealTimers()
	})

	// TODO Probably better to separate attachment upload/manipulation into its own component?
	// we need to upload-on-submit for compression setting anyway
	it('Attachments manipulations (moving, adding, removing)', () => {
	const wrapper = mount(PostStatusForm, mountOpts())

	const i1 = { id: '1', url: 'a' }
	const i2 = { id: '2', url: 'b' }
	const i3 = { id: '3', url: 'c' }
	const i4 = { id: '4', url: 'd' }
	const iX = { id: 'x', url: 'x' }

	wrapper.vm.newStatus.files = [i3, i1, iX, i2]

	wrapper.vm.removeMediaFile(iX)
	expect(wrapper.vm.newStatus.files).to.eql([i3, i1, i2])

	wrapper.vm.shiftUpMediaFile(i1)
	expect(wrapper.vm.newStatus.files).to.eql([i1, i3, i2])

	wrapper.vm.shiftUpMediaFile(i1) // should ignore
	expect(wrapper.vm.newStatus.files).to.eql([i1, i3, i2])

	wrapper.vm.shiftDnMediaFile(i3)
	expect(wrapper.vm.newStatus.files).to.eql([i1, i2, i3])

	wrapper.vm.shiftDnMediaFile(i3) // should ignore
	expect(wrapper.vm.newStatus.files).to.eql([i1, i2, i3])

	wrapper.vm.addMediaFile(i4)
	expect(wrapper.vm.newStatus.files).to.eql([i1, i2, i3, i4])
	})

	it('Attachment descriptions', () => {
	const wrapper = mount(PostStatusForm, mountOpts())

	const i1 = { id: '1', url: 'a' }

	wrapper.vm.addMediaFile(i1)
	expect(wrapper.vm.newStatus.files).to.eql([i1])

	wrapper.vm.editAttachment(i1, 'description')
	expect(wrapper.vm.newStatus.mediaDescriptions['1']).to.eql('description')
	})
	})

	describe('Draft saving', () => {
	beforeEach(() => {
	setActivePinia(createTestingPinia({ stubActions: false }))
	useUsersStore().currentUser = currentUser
	vi.useFakeTimers()
	})

	afterEach(() => {
	vi.useRealTimers()
	})

	autoSaveOrNot(
	it,
	'should save when the button is clicked',
	async (autoSave) => {
	const wrapper = mount(PostStatusForm, mountOpts())
	const store = useMergedConfigStore()
	store.mergedConfig = {
	autoSaveDraft: autoSave,
	}
	expect(useDraftsStore().draftsCount).to.equal(0)

	const textarea = wrapper.get('textarea')
	await textarea.setValue('mew mew')

	await saveManually(wrapper)
	expect(useDraftsStore().draftsCount).to.equal(1)
	expect(useDraftsStore().draftsArray[0].status).to.equal('mew mew')
	},
	)

	it('should auto-save if it is enabled', async function () {
	vi.useFakeTimers()
	const wrapper = mount(PostStatusForm, mountOpts())
	const store = useMergedConfigStore()
	store.mergedConfig = {
	autoSaveDraft: true,
	}
	expect(useDraftsStore().draftsCount).to.equal(0)
	const textarea = wrapper.get('textarea')
	await textarea.setValue('mew mew')

	expect(useDraftsStore().draftsCount).to.equal(0)
	await vi.advanceTimersByTimeAsync(waitSaveTime)
	expect(useDraftsStore().draftsCount).to.equal(1)
	expect(useDraftsStore().draftsArray[0].status).to.equal('mew mew')
	})

	it('should auto-save when close if auto-save is on', async () => {
	const wrapper = mount(
	PostStatusForm,
	mountOpts({
	props: {
	closeable: true,
	},
	}),
	)
	const store = useMergedConfigStore()
	store.mergedConfig = {
	autoSaveDraft: true,
	}
	expect(useDraftsStore().draftsCount).to.equal(0)
	const textarea = wrapper.get('textarea')
	await textarea.setValue('mew mew')
	wrapper.vm.requestClose()
	expect(useDraftsStore().draftsCount).to.equal(1)
	await waitForEvent(wrapper, 'close-accepted')
	})

	it('should save when close if auto-save is off, and unsavedPostAction is save', async () => {
	const wrapper = mount(
	PostStatusForm,
	mountOpts({
	props: {
	closeable: true,
	},
	}),
	)
	const store = useMergedConfigStore()
	store.mergedConfig = {
	autoSaveDraft: false,
	unsavedPostAction: 'save',
	}
	expect(useDraftsStore().draftsCount).to.equal(0)
	const textarea = wrapper.get('textarea')
	await textarea.setValue('mew mew')
	wrapper.vm.requestClose()
	expect(useDraftsStore().draftsCount).to.equal(1)
	await waitForEvent(wrapper, 'close-accepted')
	})

	it('should discard when close if auto-save is off, and unsavedPostAction is discard', async () => {
	const wrapper = mount(
	PostStatusForm,
	mountOpts({
	props: {
	closeable: true,
	},
	}),
	)
	const store = useMergedConfigStore()
	store.mergedConfig = {
	autoSaveDraft: false,
	unsavedPostAction: 'discard',
	}
	expect(useDraftsStore().draftsCount).to.equal(0)
	const textarea = wrapper.get('textarea')
	await textarea.setValue('mew mew')
	wrapper.vm.requestClose()
	await waitForEvent(wrapper, 'close-accepted')
	expect(useDraftsStore().draftsCount).to.equal(0)
	})

	it('should confirm when close if auto-save is off, and unsavedPostAction is confirm', async () => {
	const store = useMergedConfigStore()
	const wrapper = mount(
	PostStatusForm,
	mountOpts({
	props: {
	closeable: true,
	},
	}),
	)
	store.mergedConfig = {
	autoSaveDraft: false,
	unsavedPostAction: 'confirm',
	}
	expect(useDraftsStore().draftsCount).to.equal(0)
	const textarea = wrapper.get('textarea')
	await textarea.setValue('mew mew')
	wrapper.vm.requestClose()
	await nextTick()
	await flushPromises()
	const saveButton = await vi.waitFor(() => {
	const button = wrapper.findByText(
	'button',
	$t('post_status.close_confirm_save_button'),
	)
	if (!button) throw new Error('Save button not present')
	return button
	})
	expect(saveButton).to.be.ok
	await saveButton.trigger('click')
	console.info('clicked')
	expect(useDraftsStore().draftsCount).to.equal(1)
	await flushPromises()
	await waitForEvent(wrapper, 'close-accepted')
	})
	})
	})

File Metadata

Mime Type: text/x-diff
Expires: Sat, Oct 31, 7:04 PM (20 h, 53 m)
Storage Engine: blob
Storage Format: Raw Data
Storage Handle: 1801698
Default Alt Text: (33 KB)

No OneTemporaryActions

View Options

File Metadata

Event Timeline

No OneTemporary
Actions