Doubt:

According to MDN docs, then() and catch() returns a Pending Promise Immediately and if the handler functions doesn’t return anything, the returned promise becomes fulfilled with undefined value. So, if current Promise is P0, then() (attached to P0) returns promise P1 and catch() (also directly attached to P0) returns promise P2. Initially P1 and P2 both would be in "pending" state. Now, if catch()’s handler run, P2 will become fulfilled with undefined value. Since then()’s handler never runs will P1 always be in "pending" state? If not, then why is it’s state changed and how is it changed? (What is the flow of control of code that changes the state)

Code:

const p0 = new Promise((resolve,reject) => {
    let num = Math.random();
    setTimeout(()=> {
        if(num >= 0.5) {
            console.log("Resolved");
            resolve("Promise resolved");
        }
        else {
            console.log("Rejected");
            reject("Promise rejected");
        }   
    }, 7000);
});

const p1 = p0.then(function (resolveValue) {
    console.log("Then handler was executed");
    console.log(resolveValue);
})
console.log("P1");
console.log(p1);

const p2 = p0.catch((rejectValue) => {
    console.log("Catch handler was executed");
    console.log(rejectValue);
})
console.log("P2");
console.log(p2);
setTimeout(()=> {
    console.log("P1");
    console.log(p1);
}, 12000);
setTimeout(()=> {
    console.log("P2");
    console.log(p2);
}, 17000);

Output:

P1

Promise {<pending>}
[[Prototype]]: Promise
[[PromiseState]]: "pending"
[[PromiseResult]]: undefined

P2

Promise {<pending>}
[[Prototype]]: Promise
[[PromiseState]]: "pending"
[[PromiseResult]]: undefined

Rejected
Catch handler was executed
Promise rejected

Uncaught (in promise) Promise rejected
Promise.then (async)        
(anonymous) @   app2.js:15

P1 
Promise {<rejected>: 'Promise rejected'}
[[Prototype]]: Promise
[[PromiseState]]: "rejected"
[[PromiseResult]]: "Promise rejected"

P2
Promise {<fulfilled>: undefined}
[[Prototype]]: Promise
[[PromiseState]]: "fulfilled"
[[PromiseResult]]: undefined