Create StyleClass.spec.js

src/components/styleclass/StyleClass.spec.js

@@ -0,0 +1,38 @@
+import { config, mount } from '@vue/test-utils';
+import StyleClass from './StyleClass';
+import Button from '@/components/button/Button.vue';
+import InputText from '@/components/inputtext/InputText.vue';
+
+config.global.directives = {
+    'styleclass': StyleClass
+}
+
+config.attachTo = document.body;
+
+describe('StyleClass', () => {
+    it('should work with next selector', async () => {
+        const wrapper = mount({
+            template: `
+                <Button label="Toggle p-disabled" v-styleclass="{ selector: '@next', toggleClass: 'p-disabled' }" />
+                <InputText class="block mt-3" />
+            `,
+            components: {
+                Button,
+                InputText
+            }
+        });
+
+        const button = wrapper.find('.p-button');
+        const input = wrapper.find('.p-inputtext');
+
+        expect(input.classes()).not.toContain('p-disabled');
+
+        await button.trigger('click');
+
+        expect(input.classes()).toContain('p-disabled');
+
+        await button.trigger('click');
+
+        expect(input.classes()).not.toContain('p-disabled');
+    });
+});