fix(core): fix type check for Date prop #12272
Conversation
|
Do you have a repro? don't attach files, post plain code only |
This comment has been minimized.
This comment has been minimized.
… from another context
|
@posva I've made a much simpler code to reproduce, and now I know how to write a test code. Is this suitable? |
|
Do you have an actual boiled down reproduction? Like on a js fiddle ? |
|
It's based on buefy/nuxt-buefy#36 (comment) but upgrade to the latest version of them. I think nuxt and nuxt-buefy setup is the easiest way to reproduce. I've also checked Line 1746 in 515467a console.log and/or to start REPL session in the context.After some investigations, the value is surely an instance of v8's internal Date but value instanceof Date returns false there, because a Date a constructor of value, and a Date there, are in a different context.
|
|
That looks more like a big they should be fixing. Changing the global Date is not something tou should do |
|
Node has legitimate APIs to create a new running environment (context) for sandboxing or something else if you want. Although the two By the way, I've also come up with a reproduction code to prove there is a case that <html>
<head>
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
</head>
<body>
<div id="app">
<div>{{ date }}</div>
<test-component :date="date" />
</div>
<iframe src="child.html"></iframe>
<script>
const iframe = document.querySelector('iframe');
iframe.onload = function () {
const TestComponent = {
template: '<div>{{ date }}</div>',
props: {
date: Date,
}
}
new Vue({
el: '#app',
components: { TestComponent },
data() {
return {
// XXX: Date instance comes from another context!
date: iframe.contentWindow.date
}
},
})
};
</script>
</body>
</html><html>
<head />
<body>
This is a child.
<script>
var date = new Date();
</script>
</body>
</html>As you can see, I exploit Well... How about using the following code to fix the issue? |
|
What's the status on this? I'm currently working on a Vue app with Nuxt and getting lots of the |
|
A temporary fix is to clone the date object before transmitting to the child component with |
It checks a prop by
[object Date]instead ofinstanceof DateThis fixes a strange warning message:
[Vue warn]: Invalid prop: type check failed for prop "date". Expected Date, got Datein some circumstances.
This happens when
type: Date'sDateis in another context, such as used in dev mode in nuxt for example.I've written and attached a unit test script for nodejs to reproduce this issue easily, and I've confirmed by using the script that this PR resolves the issue.
But I'm sorry I don't know how to write and include a unit test file suitable for this project, so please someone translate the test script suitable for the project.
What kind of change does this PR introduce? (check at least one)
Does this PR introduce a breaking change? (check one)
If yes, please describe the impact and migration path for existing applications:
The PR fulfills these requirements:
devbranch for v2.x (or to a previous version branch), not themasterbranchfix #xxx[,#xxx], where "xxx" is the issue number)If adding a new feature, the PR's description includes:
Other information:
This also happens on Vue3 and should be fixed in the same way.
related issues in other projects:
nuxt/nuxt#5565
buefy/nuxt-buefy#36