How to pass props to test component? - unit-testing

Question

I am learning about unit-testing in Vue and try to test component according to this article https://alligator.io/vuejs/testing-vue-with-jest/
I have a component
<template>
<div>
<h1 :style="headingStyles">{{title}}</h1>
</div>
</template>
<script>
export default {
data() {
return {
headingStyles: {
color: this.color
}
};
},
props: ["title", "color"]
};
</script>
and file with test cases
import Vue from 'vue';
import FancyHeading from '../../src/components/FancyHeading';
function mountComponentWithProps (Component, propsData) {
console.log('props Data', propsData)
const Constructor = Vue.extend(Component);
const vm = new Constructor({
propsData
}).$mount();
return vm.$el;
}
describe('FancyHeading.vue', () => {
it('should be the correct color', () => {
const headingData = mountComponentWithProps(FancyHeading, { color: 'blue' });
const styleData = headingData.style.getPropertyValue('color');
console.log(styleData)
expect(styleData).toEqual('blue');
});
it('should have the correct title', () => {
const headingData = mountComponentWithProps(FancyHeading, { title: 'Hello, Vue!' });
const titleData = headingData.textContent;
expect(titleData).toEqual('Hello, Vue!');
});
});
When I run yarn test:unit I receive error
FancyHeading.vue › should be the correct color
expect(received).toEqual(expected) // deep equality
Expected: "blue"
Received: ""
Looks like color is empty xtring, but I don't understand why. Can someone explain me and help to pass test?