my attempt at using copilot to scrap my own converstation

copilot.js

var serp = document.querySelector('cib-serp');
    console.log("Found # serp: ")
    console.log(serp)

    var conversation = ""

    /* Check if the element has a shadow root */
    if (serp && serp.shadowRoot) {
        /* Select the "cib-conversation" element within the shadow root */
        var conversation = serp.shadowRoot.querySelector('cib-conversation');
        console.log("Found # conversation: ")
        console.log(conversation)

        /* Check if the element has a shadow root */
        if (conversation && conversation.shadowRoot) {

            /* Select the "cib-chat-main" element */
            var chatMain2 = conversation.shadowRoot.querySelector('#cib-chat-main');

            console.log("Found # chatMain: " )
            console.log(chatMain2)

            /* its div not a shadowroot */
            if (chatMain2) {
                var chatTurns2 = chatMain2.querySelectorAll('cib-chat-turn');
                console.log("Found # chatTurns: " + chatTurns2.length)
                console.log(chatTurns2)
                /* Loop over each "cib-chat-turn" element */
                chatTurns2.forEach((chatTurn) => {
                    /* Check if the element has a shadow root */
                    if (chatTurn.shadowRoot) {
                        /* Select all "cib-message-group" elements with attribute source=user within the shadow root */
                        var messageGroups2 = chatTurn.shadowRoot.querySelectorAll('cib-message-group[source=user]');
                        console.log("Found # messageGroups: ")
                        console.log(messageGroups2)
                        /* Loop over each "cib-message-group" element */
                        messageGroups2.forEach((messageGroup) => {
                            /* Check if the element has a shadow root */
                            if (messageGroup.shadowRoot) {
                                /* Select all "cib-message" elements within the shadow root */
                                var messages2 = messageGroup.shadowRoot.querySelectorAll('cib-message');
                                console.log("Found # messages: ")

                                console.log(messages2)

                                /* Loop over each "cib-message" element */
                                messages2.forEach((message) => {
                                    /* Check if the element has a shadow root */
                                    if (message.shadowRoot) {
                                        /* Select the "div.content" element within the shadow root */
                                        var contentDiv = message.shadowRoot.querySelector('div.content');
                                        console.log("Found # contentDiv: ")
                                        console.log(chatTurns2)

                                        /* Check if the element exists and print its innerText */
                                        if (contentDiv) {
                                            /* console.log(contentDiv.innerText); */
                                            conversation +=  "\n\n" + contentDiv.textContent.trim()
                                        }
                                    }
                                });
                            }
                        });
                    }
                });
                console.log("Your PROMPTS\n\n")
                console.log(conversation)
            }

        }
    }

my-prompts.txt

how to query custom webcomponent "cib-chat-turn" with js ?

Sent by you:
it doesnt return anynote list though the page has a component "cib-chat-turn"

Sent by you:
how to get custom webcomponents registered in the page via js

Sent by you:
given the below html. how to i loop all custom component "cib-chat-turn" with js and find 
its child a custom component "cib-message-group" with attrib source=user and print their count?

<div class="main" id="cib-chat-main"><slot name="wlcmCntnrChld"></slot>
            <slot></slot>
            <!---->
  
      <cib-welcome-container product="bing" chat-type="enterprise" hidden="">
        
      </cib-welcome-container>
    

            
                <cib-chat-turn serp-slot="none" mode="conversation"></cib-chat-turn>
              
                <cib-chat-turn serp-slot="none" mode="conversation"></cib-chat-turn>
              
                <cib-chat-turn serp-slot="none" mode="conversation"></cib-chat-turn>

Sent by you:
do you think it is going to work, given the fact custom element will be inside a shadowRoot?

Sent by you:
given the below is the custom components and its hierarchy with each of customcomponent has shadowRoot, how can i find  the div.content's .innerText, in multiple "cib-chat-turn" in #cib-chat-main


cib-serp
  cib-conversation
    div#cib-chat-main
      cib-chat-turn
        cib-message-group source=user source=bot
          cib-message
            cib-shared
              div.content text-message-content

Sent by you:
update the above code to match chatTurn.shadowRoot.querySelectorAll('cib-message-group'); when it include attr "source=user"

Sent by you:
you didnt include first two custom elements cib-serp
  cib-conversation