Panel-backdrop stays open after panel is closed (only using component)

I moved the right panel into a component and noticed I can’t click anymore. The panel-backdrop seems to stay opened after I close the panel. Web inspector shows it at full width/height.

It works fine though, if the panel was in the index.html or I load a templateUrl. But when loading a componentUrl the panel opens once, but after I close it the backdrop stays.

Framework7 3.5.2
Tested in Safari + Chrome
No errors in console

<template>
	<div class="panel panel-right panel-reveal theme-dark">
		<div class="view">
			<div class="page">
				<div class="navbar">
					<div class="navbar-inner">
						<div class="title">title</div>
					</div>
				</div>
				<div class="page-content">
					<div class="block">
						<p>Test</p>
						<a href="#" class="panel-close">Close me</a>
					</div>
				</div>
			</div>
		</div>
	</div>
</template>
<script>
	return {
		data: function () {
			return {
				username: store.get('username')
			};
		}
	};
</script>

This is my route

{
		path: '/panel-right/',
		panel: {
			componentUrl: './pages/panel-right.html',
			// templateUrl: './pages/panel-right-template-test.html',
		}
	},

Can you try to update F7 to latest version and check if the issue is still there?

Yeah, I noticed, there is a new version and updated. Error stays the same.

Ok, i see the issue. Will be fixed in next update

Cool! Thanks,

I tried to find the function for that, but Framework7 is still very new for me … and I still have a hard time learning JS. Will check GitHub and try to spot what you did :slight_smile:

I’m seeing the issue with version 6.0.22. I also see the issue where the left panel is all white and content is only visible if I remove background-color of the left panel. Is there a workaround for this?