Skip to content

feat: add unit tests for the framework #35

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 5 commits into
base: main
Choose a base branch
from
Open

feat: add unit tests for the framework #35

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
bdea864
feat: add jest configuration and test cases for the framework
sniperadmin Oct 8, 2021
b354262
Merge branch 'feat/unit-test'
sniperadmin Oct 8, 2021
9123beb
feat: add coverage workflow
sniperadmin Oct 9, 2021
bbab2fa
feat: add p5 constants to the sketch payload
sniperadmin Oct 10, 2021
b17eff7
feat: add ts support and re export p5
sniperadmin Oct 13, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
46 changes: 43 additions & 3 deletions src/p5.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,16 @@ const initialEvents = [
"windowResized"
];

const initialConstants = [
'HALF_PI',
'PI',
'QUARTER_PI',
'TAU',
'TWO_PI',
'DEGREES',
'RADIANS'
]

export default {
// re-export p5 for use with other libraries
p5,
Expand All @@ -51,21 +61,51 @@ export default {
: initialEvents;
}
},
mounted() {
new p5(sketch => {
methods: {
/**
* @function extractConstants
* @param {object} sketch => sketch object
* @returns {object} of constants
*/
extractConstants: function (sketch) {
Copy link
Author

@sniperadmin sniperadmin Oct 10, 2021 •
edited
Loading

Choose a reason for hiding this comment

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

This one works!
However, I think this approach needs to be checked as I may think it could be done better than this.

  • I thought to first generate the { key, value } set of the p5 constants first
  • Then, injecting them into the sketch just before emitting the sketch context

The cons of this approach:

  • I cannot test the method directly from the main component => gives undefined when I try to get the value in line 73
const savedKey = sketch[p5ConstName]

Workarounds

In the test file, I tested the component as if I am reusing it (re-usability). It returns the constants needed

let constantsToExport = {}
for (const p5ConstName of initialConstants) {
const savedKey = sketch[p5ConstName]

if (savedKey) {
constantsToExport[p5ConstName] = savedKey;
}
}
return { ...constantsToExport };
},

extractEvents(sketch) {
/**
* @function extractConstants
* @see line87 for more details
*/
const constants = this.extractConstants(sketch)
// NOTE: resetting sketch payload
sketch = { ...sketch, ...constants };
// emmiting with the new defined consts
this.$emit("sketch", sketch);

for (const p5EventName of this.p5Events) {
const vueEventName = p5EventName.toLowerCase();
const savedCallback = sketch[p5EventName];

sketch[p5EventName] = (...args) => {
if (savedCallback) {
savedCallback(sketch, ...args);
}
this.$emit(vueEventName, sketch, ...args);
};
}
}
},
mounted() {
new p5(sketch => {
this.extractEvents(sketch)
}, this.$el);
}
};
Expand Down
31 changes: 29 additions & 2 deletions tests/unit/p5.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ describe('p5', () => {


it('should return exact computed events', () => {
console.log(wrapper.vm.p5Events)
// console.log(wrapper.vm.p5Events)
expect(wrapper.vm.p5Events).toStrictEqual([
'preload', 'setup',
'draw', 'deviceMoved',
Expand All @@ -36,10 +36,37 @@ describe('p5', () => {
})


xit('should return P5 constants', () => {
it('should return P5 constants', () => {
/**
* HALF_PI PI QUARTER_PI TAU TWO_PI DEGREES RADIANS
*/
const mockComponent = {
template: `
<p5 @sketch="sketch"></p5>
`,
data() {
return {
skObj: null
}
},
methods: {
sketch(sk) {
this.skObj = sk
}
}
}

const mockWrapper = mount(mockComponent, {
components: {p5}
})

const data = mockWrapper.vm.skObj

expect(data.HALF_PI).toStrictEqual(1.5707963267948966)
expect(data.PI).toStrictEqual(3.141592653589793)
expect(data.QUARTER_PI).toStrictEqual(0.7853981633974483)
expect(data.TAU).toStrictEqual(6.283185307179586)
expect(data.TWO_PI).toStrictEqual(6.283185307179586)
})

xit('should return rest of structure events', () => {
Expand Down