Skip to content

Conversation

@paulinaczybir
Copy link
Collaborator

Added basic version of menu component

Both the button and container for item are customisable, as they are just plain slot elements (so the styles here are of course not important:) )
Screenshot 2024-02-19 at 14 08 15

@sonarqubecloud
Copy link

const showMenu = ref(false)
const menu = ref(null)

const toggle = () => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

These mutations are like some hooks under the hood, right?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's just syntax for writing method in composition API (opposed to option API that we are used to see more :))

it('toggles menu to true when clicking', () => {
const wrapper = mount(Menu);
wrapper.vm.showMenu = false;
wrapper.vm.toggle(wrapper.vm.showMenu);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just fyi, dom events can be triggered directly instead of calling the fn attached to the listener.
Eg: wrapper.find('.menu-trigger').trigger('click'); will trigger the event listener, calling your function. You could check then that the 'menu-content' element is rendered as a consequence instead of checking the variable's value. Eg: expect(wrapper.find('.menu-content').exists()).toBeTruthy()

No need to change, just a different type of test.

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you! I will leave it as it is and try to use this way when appropriate in the future :)

@paulinaczybir paulinaczybir merged commit aa5a4c9 into master Feb 19, 2024
@paulinaczybir paulinaczybir deleted the feature/LITE-29476-create-menu-component branch February 19, 2024 15:09
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants