Setting props before mounting the web component causes them to be overwritten by default values

[TomCaserta]

Given a web component which accepts an input property eg.

import Vue from 'vue';
import Component from 'vue-class-component';
import { Prop } from 'vue-property-decorator';

@Component({
    name: 'my-custom-element',
})
export default class ExampleComponent extends Vue {
    @Prop({
        default: () => ({ anObject: 'Testing!' })
    }) someProp: { anObject: string };
}

And then creating it via JS:

const custom = document.createElement('my-custom-element');
custom.someProp = { anObject: 'Changed!' };

document.body.appendChild(custom);

The value of someProp is immediately overwritten once the component has been attached to the DOM. If we move the custom.someProp assignment after the call to appendChild it works but that shouldn't be necessary.