nextcloud-vue icon indicating copy to clipboard operation
nextcloud-vue copied to clipboard

NcActions open toggle flickers if devtools are opened

Open skjnldsv opened this issue 2 years ago • 1 comments

Devtools opened Closed
Peek 08-04-2023 09-27 Peek 08-04-2023 09-28

Not sure this is really an issue, but am I the only one? :sweat_smile:

Reproducible code
<template>
	<div>
		<button @click="open=open===1?2:1">Toggle</button>
		<NcActions :force-menu="true" :open="open===1">
			<NcActionButton @click="actionDelete">
				<template #icon>
					<Delete :size="20" />
				</template>
				Delete
			</NcActionButton>
		</NcActions>
		<NcActions :force-menu="true" :open="open===2">
			<NcActionButton @click="actionDelete">
				<template #icon>
					<Delete :size="20" />
				</template>
				Delete
			</NcActionButton>
		</NcActions>
	</div>
</template>
<script>
import Delete from 'vue-material-design-icons/Delete'

export default {
	components: {
		Delete,
	},
	data() {
	  return {open:0}
	  },
	methods: {
		actionDelete() {
			alert('Delete')
		},
	},
}
</script>

skjnldsv avatar Apr 08 '23 07:04 skjnldsv

Can reproduce in Firefox when not just devtools but the Elements tab is open.

It seems that the slowing part here is highlighting updates. Rendering of NcActions itself seems fast enough, ~6-10ms

image

ShGKme avatar Mar 08 '24 11:03 ShGKme