View TestInspiration.test.js
import { mount } from '@vue/test-utils';
import FakeComponent from '../components/FakeComponent.vue';
describe('FakeComponent', () => {
test('it should display the right number of table rows', () => {
const wrapper = mount(FakeComponent);
expect(
wrapper.findAll('[data-test="fake-table-row"]').wrappers.length
).toBe(2);
});
View CoolCard.test.js
import { mount } from '@vue/test-utils';
import CoolCard from '../components/CoolCard.vue';
describe('CoolCard', () => {
test('should render content correctly', () => {
const wrapper = mount(CoolCard);
expect(wrapper.find('[data-test="cool-card-div"]').text()).toEqual(
'hello I am a card :)'
);
});
View .babelrc
"env": {
"test": {
"plugins": ["transform-es2015-modules-commonjs"]
}
}
View package.json
"jest": {
"moduleFileExtensions": [
"js",
"vue"
],
"transform": {
"^.+\\.js$": "babel-jest",
".*\\.(vue)$": "vue-jest"
}
}
View CoolCard.vue
<template>
<div
class="vte__cool-card"
data-test="cool-card-div"
>
hello I am a card :)
</div>
</template>
<script>
View App.test.js
describe('App.vue', () => {
test('should mount for testing', () => {
expect(1).toEqual(1);
});
});
View acceleration.html
<html>
<head>
<title>Welcome to the danger zone</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body {
text-align: center;
}
.danger-zone {
background-color: #EE3333;
View double_quotes.js
class Question {
constructor() {
this.answer = "No.";
}
answerMe() {
return this.answer;
}
}
const doesJavaScriptHaveClasses = new Question();
View fusionCuisine.js
const el = document.querySelector("#app");
const spicyObject = {
spicyMethod() {
return 'feel the heat';
}
};
const fullOfPotential = {};
View class_method_sad.py
class ImaginativeClassName:
description = 'wow'
@classmethod
def class_method(cls):
return (cls.description, self.greeting)
obj = ImaginativeClassName()
obj.greeting = 'mindblowing insight'
obj.instance_method() # AttributeError: type object 'ImaginativeClassName' has no attribute 'greeting'