I am trying to make a chrome extension, and I would have to update a JS file very often, so I put a external link for it. I want to acess the variable promocodes (which is an object) in that carregar() function.

function carregar(){
    const promocodesScriptObj = document.createElement("script");
    promocodesScriptObj.setAttribute("src", "https://raw.githubusercontent.com/leonardobagi/robloxpromocodemaster/main/promocodesObj.js");
    promocodesScriptObj.setAttribute("type", "text/javascript");
    document.querySelector("head").appendChild(promocodesScriptObj);
...
}

But then when I try loading the page, it catches the following error:

Refused to load the script ‘https://raw.githubusercontent.com/leonardobagi/robloxpromocodemaster/main/promocodesObj.js’ because it violates the following Content Security Policy directive: “script-src ‘self’ ‘unsafe-inline’ ‘unsafe-eval’ *.evidon.com *.gigya.com *.google-analytics.com *.ns1p.net adservice.google.com ajax.aspnetcdn.com ajax.googleapis.com …

I have no idea of how to fix it. I’ve tried adding the following line to manifest.json, but it stills returning the same error

    "content_security_policy": {
        "extension_pages": "script-src 'self'; object-src 'self'",
        "sandbox": "sandbox allow-scripts; script-src 'self' 'https://apis.google.com/' 'https://www.gstatic.com/' 'https://*.firebaseio.com' 'https://www.googleapis.com' 'https://ajax.googleapis.com' 'https://raw.githubusercontent.com'; object-src 'self'"
    },

I am fairly new to web development and using API’s, and for some reason I keep getting a 401 “Access denied due to missing hibp-api-key.” error when trying to use this one API for the website HaveIBeenPwned. I’m using Postman just to check the API, and here is what I am using: https://haveibeenpwned.com/api/v3/pasteaccount/foo%40bar.com%20hibp-api-key:%20XXXXXXXXXXXX #API Key was redacted at the end, and the email is a test email.

Can anyone tell me what I’m doing wrong, and why it keeps giving me an error? I’ve checked my API key a million times and I just don’t know why this isn’t working! Here is the documentation: https://haveibeenpwned.com/API/v3
It says:

The API takes a single parameter which is the email address to be
searched for. The email is not case sensitive and will be trimmed of
leading or trailing white spaces. The email should always be URL
encoded. This is an authenticated API and an HIBP API key must be
passed with the request.

GET https://haveibeenpwned.com/api/v3/pasteaccount/{account}
hibp-api-key: [your key]

I have code here that when it runs, it emails the Project Owner the project name, and all related tasks & notes for all projects. It checks to see if the LastUpdate is within 24 hours of the current time.
(Thank you @Tanaike)

Ideally what I would like, is in Appsheet when I press a button it makes a webhook/api call reference to the single project based on an API call/webhook? so it doesnt send an email for every single project. Just a single project from referenced row from a webhook/api/appsheet button.

Here is the Code:

function myFunction() {
  // Retrieve 3 sheets.
  const ss = SpreadsheetApp.getActiveSpreadsheet();
  const [sheetITPM, sheetITPM_Tasks, sheetNotes] = ["ITPM", "ITPM_Tasks", "Notes"].map(e => ss.getSheetByName(e));

  // Retrieve IDs, names and emails.
  const values = sheetITPM.getRange("A2:J" + sheetITPM.getLastRow()).getValues().map(r => ({ id: r[0], name: r[1], email: r[9] }));

  // Retrieve Tasks.
  const tasks = sheetITPM_Tasks.getRange("A2:H" + sheetITPM_Tasks.getLastRow()).getValues().reduce((o, r) => (o[r[2]] = o[r[2]] ? [...o[r[2]], { description: r[3], status: r[4], dueDate: r[6], t_lastUpdate: r[7] }] : [{ description: r[3], status: r[4], dueDate: r[6], t_lastUpdate: r[7] }], o), {});

  // Retrieve Notes.
  const notes = sheetNotes.getRange("A2:F" + sheetNotes.getLastRow()).getValues().reduce((o, r) => (o[r[1]] = o[r[1]] ? [...o[r[1]], { note: r[2], date: r[4], n_lastUpdate: r[5]}] : [{ note: r[2], date: r[4], n_lastUpdate: r[5] }], o), {});
  Object.entries(notes).forEach(([, v]) => v.sort((a, b) => a.date.getTime() < b.date.getTime() ? 1 : -1)); // Sort Notes by Date field 

  // Check if task last update within 24 hours
  const now = new Date().getTime();
  const before24h = now - (25 * 60 * 60 * 1000);
  Object.entries(tasks).forEach(([k, v]) => {
    tasks[k] = v.filter(({t_lastUpdate}) => {
      const temp = dueDate.getTime();
      return now > temp && temp > before24h;
    });
  });
  Object.entries(notes).forEach(([k, v]) => {
    notes[k] = v.filter(({n_lastUpdate}) => {
      const temp = date.getTime();
      return now > temp && temp > before24h;
    });
  });

  // Send emails.
  values.forEach(({ id, name, email }) => {
    const message = [
      `Here is the project update for: ${name}`,
      "",
      `Assigned Tasks:`,
      ...tasks[id].map(({ description, status, dueDate, t_lastUpdate }, i) => [`Task ${i + 1}:`, description, status, dueDate, t_lastUpdate, ""].join("n")),
      "",
      `Project Notes:`,
      ...notes[id].map(({ note }, i) => [`Note ${i + 1}:`, note, ""].join("n")),
    ].join("n");
    MailApp.sendEmail({ to: email, subject: "Project update", body: message });
  });
}

Introduction

My company needs to build a Website Builder platform and I was tasked to gather all the needed Information and technologies needed.
It will be used to create a simple admin dashboards for our customers to be able to login and view reports done by our company, it will be personalized according to each customer but it will mostly have the same layout and components
e.g:

Same:

• headers
• same amount of pages
• mostly same amount of objects

but will differ in:

• colors
• text
• some additional tables that will be added according to each customer.

so overall the template itself won’t change that much but the design will.

Basic Information

• After completing the project it is expected to be used by a “non-developer” employee so it needs to be user friendly and mostly use the GUI to interact with the project to create the website with as little coding as possible.
• It is highly preferred if it is done as a browser based project not an application since it needs to be accessible in both Mac and Windows systems as well as the ability to use it in mobile/iPad systems.
• It must be an in house project so can’t just use something like WIX or squarespace
• I know its a mammoth task but I am not doing it alone, we have a team of developers and I am just gathering information and ideas.

what’s expected form the answers

• Any good additional ideas/Modifications to improve this project
• Overall step by step of how to achieve this project if possible (like you should do this then this but not like a detailed tutorial of course)
• Technologies Recommendations to be used (languages, libraries, etc..)

Note: To eliminate confusion Whenever I mention “Project” I mean the “Website builder” itself

Thanks in advance

From what I understand, setting innerHTML on an element is bad, because if the new contents come from users, a malicious user can use it to inject <script> tags and other harmful content.

As demonstrated by this question, there are now about eight different alternative tags (with some non-standard).

In my case, I want to be able to insert actual html tags like <b> and <i>, and even <a>.

But I never need <script> to be inserted.

Is there a standardized best-practice alternative to innerHTML using vanilla Javascript?

I got this error trying to run nodejs

node: error while loading shared libraries: libicui18n.so.70: cannot open shared object file: No such file or directory

i tried updating using

sudo pacman -Syu

and i also tried removing nodejs and re-installing it with no help.

I use Arch btw.

How can i get multiple elements in javascript for example:

<p class="zrowOdd"> odd </p>
<p class="zrowEven"> even </p>
<p class="zrowOdd"> odd </p>
<p class="zrowEven"> even </p>

Is it possible to get all that elements in order in X:

var x = document.getElementByClassName("zrowOdd + zrowEven")// I know this 
dont work but just to be clear what i need

I’m trying to get purchase order details from server

This is my code:

    function getPurchaseOrderInfo() {
      try {
        let po_ref = document.getElementById("po_ref").value;
        let data = new FormData();
        data.append("po_ref", po_ref);
        data.append("request_token", request_token);
        fetch(URL_ROOT + "purchase-orders/get_purchase_order_info", {
            method: "POST",
            body: data,
          })
          .then((res) => res.json())
          .then((msg) => {
            console.log(msg);
            return msg.status ? msg.data : false;
          });
      } catch (error) {
        console.log(error);
      }
    }

    console.log(getPurchaseOrderInfo());

This is what I got by executing the script

I have no idea why I’m getting an undefined value instead of object shown at console.log(msg);

I need the object to print a table and show details to user

so I have a question, which maybe it’s a little ez, but… I don’t know hehe, so, how do you get a value that’s in the domain? like:

https://example.com?test=helloworld

how do I get the value of the “test” variable that is there?

I am working on a Google Chrome Extension that will have a feature to highlight specific words. I have been able to get the extension to highlight words within the popup window. However, when I try to modify my code and highlight words from the Active Tab I run into issues. I am trying to use chrome.tabs.sendMessage to perform the action. The message never hits the listener that I have in place. Maybe I have it in the wrong file?

popup.html

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="button.css">
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery-3.6.0.min.js"></script>
    <script src="popup.js"></script>
    <script src="selection.js"></script>
    <script src="hilitor.js"></script>

</head>
<body>
    <button id="highlightText">Scan for Washington</button>
</body>
</html>

background.js

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse){
    if (request.message == "getSelection"){
       console.log("Inside Get Selection");
       var myHilitor = new Hilitor("content"); // id of the element to parse
       myHilitor.apply("washington state one");
       console.log(request, sender, sendResponse);
    }
    sendResponse();
});

popup.js

$(function(){
    $('#highlightText').click(function(){highlightAllText();});
});

function highlightAllText() {
    console.log("Inside Highlight All Text");

    chrome.windows.getCurrent(w => {
        chrome.tabs.query({active: true, windowId: w.id}, tabs => {
            chrome.tabs.sendMessage(tabs[0].id, {
                "message": "getSelection"
            });
        });
    });

I am currently using Washington Wikipedia as my page to highlight. I am also using the Hilitor Library to perform the highlighting at this moment. Again, I can highlight everything in the popup window that is created from popup.html, but I can’t highlight outside of that.

I want to have a PNG sequence that displays 68 frames of animation and then loops the final 20 frames x number of times.

I based my code on the suggestion from ‘r3mainer’ on your page:
[https://stackoverflow.com/questions/43595504/play-one-part-of-gif-first-then-loop-a-certain-section-indefinitely]

But I can not get it to work.

I created the vertical PNG ‘film strip’, a CSS file with the appropriate background style info, and a JS file referenced in an HTML.

With the PNG, the JS, the HTML, and the CSS uploaded all I get for an image on the page is the first ‘frame’ of the PNG strip. There are no error messages.

I think there’s something I don’t understand about how the JS code should be deployed.

Here’s my HTML file:

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Strip Test</title>    
    <script src="film_strip_script.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <link rel="stylesheet" href="draw.css">
 </head>

<body>
<div id="draw"></div>
</body>

The CSS:

#draw {
  width: 279px;
  height: 202px;
  margin:  0 auto;
  background: url(basquiat_strip.png) top center;
}

JavaScript file:

$(function() {
  var ani = {
    frame_height: 202,
    num_frames: 68,
    loop_frame: 30,
    frame_duration: 1,
    cur_frame: 0
  };
  window.setInterval(
    function() {
      $('#draw').css( 'background-position-y',
                      (-ani.frame_height * ani.cur_frame ) + 'px'
                    );
      ani.cur_frame = (ani.cur_frame + 1) % ani.num_frames;
      if (ani.cur_frame == 0) ani.cur_frame = ani.loop_frame;
    },
    ani.frame_duration
  );
});

I am working on a Yahtzee project and i am trying to put out a bonus of 35 points if the user passes 62 points but it wont seem to add into the total but i do get the alert of it saying “you get a bonus” but it just doesnt show on the actual page
The error im getting is
Uncaught TypeEroor: Cannon read properties of undefined (reading ‘toString’)
at nextRound (145)
at rollDice (99)
at HTMLButtonElement.onclick (347)

        let dice = [
            {'img': 'Die1.PNG', 'value': 1},
            {'img': 'Die2.PNG', 'value': 2},
            {'img': 'Die3.PNG', 'value': 3},
            {'img': 'Die4.PNG', 'value': 4},
            {'img': 'Die5.PNG', 'value': 5},
            {'img': 'Die6.PNG', 'value': 6}
        ]
        let userDice =[
            {'dice': 0, 'checked': false, 'id': "d1"},
            {'dice': 0, 'checked': false, 'id': "d2"},
            {'dice': 0, 'checked': false, 'id': "d3"},
            {'dice': 0, 'checked': false, 'id': "d4"},
            {'dice': 0, 'checked': false, 'id': "d5"},
        ]
        let scorecard = [
            {'num':1, 'value' :0, 'area' : "ace1"},
            {'num':2, 'value' :0, 'area' : "twos1"},
            {'num':3, 'value' :0, 'area' : "threes1"},
            {'num':4, 'value' :0, 'area' : "fours1"},
            {'num':5, 'value' :0, 'area' : "five1"},
            {'num':6, 'value' :0, 'area' : "sixes1"},
        ]
        var turns = 5;
        var rollsLeft = 3;
        var wins =0;
        var losses = 0;
        const WINPOINTS=200;
        function user(){
            //document.getElementById("name").innerHTML= prompt("Enter your name");
        }
        function rollDice() {
            if (rollsLeft > 0) {
                for (let i = 0; i < userDice.length; i++) {
                    if (userDice[i].checked == false)
                    {
                        let rDie = Math.floor(Math.random() * 6);
                        document.getElementById(userDice[i].id).innerHTML = `<img src ="imgs/${dice[rDie].img}" height='50px' width='50px'> `;
                         userDice[i].value = dice[rDie].value;
                    }
                }
                rollsLeft--;
                var display = document.getElementById("rollsLeft")
                display.innerHTML = rollsLeft;

            } else {
                nextRound();
                for(let j = 0; j < userDice.length; j++)
                {
                    userDice[j].checked = false;
                     //rollsLeft = 3;
                }
            }
        }
        function nextRound(){
            let keepDice = 0;
           let totalSum= 0;
           let roundSum = 0;
            let bonus = 35;
            if (turns > 0) {
                keepDice = prompt("What number do you wish to keep? ");
                for (let i = 0; i < userDice.length; i++) {
                    if (userDice[i].value == keepDice) {
                        roundSum += userDice[i].value
                    }
                }
                scorecard[keepDice - 1].value = roundSum;

                document.getElementById(scorecard[keepDice - 1].area).innerHTML = roundSum.toString();
            }
            else
                {
                    keepDice = prompt("What number do you wish to keep? ");
                    for (let i = 0; i < userDice.length; i++) {
                        if (userDice[i].value == keepDice) {
                            roundSum += userDice[i].value
                        }
                    }
                    scorecard[keepDice - 1].value = roundSum;

                    document.getElementById(scorecard[keepDice - 1].area).innerHTML = roundSum.toString();

                    for (let j = 0; j < userDice.length + 1; j++)
                    {
                        totalSum += scorecard[j].value;
                    }
                    document.getElementById("total1").innerHTML = totalSum.toString();

                    if (totalSum > 62)
                    {
                        totalSum += bonus;
                        alert("You get a bonus!!")
                        document.getElementById("bonus1").innerHTML.bonus.toString();
                        document.getElementById("total1").innerHTML = totalSum.toString();

                    }
                    else
                    {
                        document.getElementById("bonus1").innerHTML = "0";
                    }
                    alert("game over")
                }
            }

        // let wins = document.getElementById("wins");
        // let losses = document.getElementById("losses");
        // if(wins > WINPOINTS){
        //   wins++
        // }else {
        //   losses++
        // }

        $( document ).ready(function() {
            resetThings();
            console.log( "yo im ready!" );

            function resetThings(){
                rollDice();

            }

            $("#reset").click(function() {
                alert("reset this");
                rollsLeft=3;
                var display = document.getElementById("rollsLeft")
                display.innerHTML = rollsLeft;
                rollDice();
                $('input[type=checkbox]:checked').each(function(){
                    $(this).prop('checked', false);
                });
                $('input[type=checkbox]:checked').each(function(){
                    $(this).prop('value', 0);
                });
                turns--;
                document.getElementById("turnsLeft").innerHTML = `${turns}`;
            })

            $("#d1Check").click(function () {
                if (userDice[0].checked) {
                    userDice[0].checked = false;
                } else {
                    userDice[0].checked = true;
                }
            })
            $("#d2Check").click(function () {
                if (userDice[1].checked) {
                    userDice[1].checked = false;
                } else {
                    userDice[1].checked = true;
                }
            })
            $("#d3Check").click(function () {
                if (userDice[2].checked) {
                    userDice[2].checked = false;
                } else {
                    userDice[2].checked = true;
                }
            })
            $("#d4Check").click(function () {
                if (userDice[3].checked) {
                    userDice[3].checked = false;
                } else {
                    userDice[3].checked = true;
                }
            })
            $("#d5Check").click(function () {
                if (userDice[4].checked) {
                    userDice[4].checked = false;
                } else {
                    userDice[4].checked = true;
                }        })
        })
        body{
            background-color: #555555;
        }
        td {
            width: 30%;
            font-size: small;
        }
        .col-6{
            padding-bottom: 30px;
            padding-top: 25px;
            color: white;

        }
        .col-6 span{
            color: black;
            padding-right: 20px;
        }
        .resTable span{
            padding-left: 20px;
        }
        .resTable{
            border-style: solid;
            border-color: black;
            border-width: thin;
        }
        h1 {
            margin-bottom: -20px;
        }
        h1{
            font-family: Papyrus;
            font-size: 45px;
        }
        li a {
            margin-top: 40px;
            margin-left: 20px;
        }
<!doctype html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- Bootstrap CSS -->
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
    <script   src="https://code.jquery.com/jquery-3.6.0.min.js"
              integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
              crossorigin="anonymous"></script>
    <style>
    ...
    </style>
    <script>
    </script>
     <title>Hello, world!</title>
</head>
<body onload="user()">
<div class ="container-fluid">
    <header class=" mb-4 border-bottom border-dark">
        <div class="row">
            <div class="col-5">
                <ul class="nav nav-pills">
                    <li class="nav-item">
                        <a href="https://usbrandcolors.com/apple-colors/" class="nav-link active link-dark bg-dark text-light">Color</a>
                    </li>
                </ul>
            </div>
            <div class="col-6">
                <h1><span>Dark</span><img src="imgs/543598.png" width="180"height="80"></h1>
            </div>
        </div>
    </header>
    <div class="row">
        <div class="col">
            <div class="col-9">
                PLAYERS NAME: <span id="name"></span>
            </div>
            <br>
            <br>
            <table class="resTable table-bordered">
                <tbody>
                <tr>
                    <th scope="row">Win points</th>
                    <td><span id="200">200</span></td>
                </tr>
                <tr>
                    <th scope="row">Wins</th>
                    <td><span id="wins">0</span></td>
                </tr>
                <tr>
                    <th scope="row">Losses</th>
                    <td><span id="losses">0</span></td>
                </tr>
                </tbody>
            </table>
        </div>
        <div class="col-4">
            <table class="table table-bordered border-dark border border-2 table-sm">
                <caption>* if total score is 62 or over <br>** of upper section</caption>
                <thead>
                <tr>
                    <th scope="col">UPPER <br>SECTION</th>
                    <th scope="col">HOW TO <br>SCORE</th>
                    <th scope="col">GAME <br>#1</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <th scope="row">ACE <img src="imgs/Die1.PNG" width="40"height="38" > =1</th>
                    <td>Count and <br> add only <br>ACES</td>
                    <td><div id="ace1"></div></td>
                </tr>
                <tr>
                    <th scope="row">TWOS <img src="imgs/Die2.PNG" width="40"height="38" > =2</th>
                    <td>Count and <br> add only <br>TWOS</td>
                    <td><div id="twos1"></div></td>
                </tr>
                <tr>
                    <th scope="row">THREES <img src="imgs/Die3.PNG" width="40"height="38" > =3</th>
                    <td>Count and <br> add only <br>THREES</td>
                    <td><div id="threes1"></div></td>
                </tr>
                <tr>
                    <th scope="row">FOURS <img src="imgs/Die4.PNG" width="40"height="38" > =4</th>
                    <td>Count and <br> add only <br>FOURS</td>
                    <td><div id="fours1"></div></td>
                </tr>
                <tr>
                    <th scope="row">FIVES <img src="imgs/Die5.PNG" width="40"height="38" > =5</th>
                    <td>Count and <br> add only <br>FIVES</td>
                    <td><div id="five1"></div></td>
                </tr>
                <tr>
                    <th scope="row">SIXES <img src="imgs/Die6.PNG" width="40"height="38" > =6</th>
                    <td>Count and <br> add only <br>SIXES</td>
                    <td><div id="sixes1"></div></td>
                </tr>
                <tr>
                    <th scope="row">3 of a kind</th>
                    <td>Add total <br> of all dice</td>
                    <td></td>
                </tr>
                <tr>
                    <th scope="row">4 of a kind</th>
                    <td>Add total <br> of all dice</td>
                    <td></td>
                </tr>
                <tr>
                    <th scope="row">FULL HOUSE</th>
                    <td>Score 25</td>
                    <td></td>
                </tr>
                <tr>
                    <th scope="row"><b>TOTAL SCORE</b></th>
                    <td> <img src="imgs/arrow.png" width="60" height="30"></td>
                    <td></td>
                </tr>
                <tr>
                    <th scope="row"><b>BONUS*</b></th>
                    <td>Add total <br> of all dice</td>
                    <td><div id="bonus1"></div></td>
                </tr>
                <tr>
                    <th scope="row"><b>TOTAL**</b></th>
                    <td> <img src="imgs/arrow.png" width="60" height="30"> </td>
                    <td><div id="total1"></div></td>
                </tr>

                </tbody>
            </table>
        </div>
        <div class="col-4">
            <h3>Your Dice</h3>
            <form id="shuffle">
                <button type="button" class="btn btn-dark" id="rollBtn" onclick="rollDice();">Roll</button>
                <button type="button" class="btn btn-dark" id="reset">Reset</button>
                <p>Rolls left: <span id="rollsLeft">2</span>  Turns Left:<span id="turnsLeft">5</span></p>
            </form>
            <table class="table table-borderless table-sm table-hover ">
                <tr> <td> Save: <input type="checkbox" name='diceCheck' id="d1Check" /> </input> </td>
                    <td id="d1"> <img src="imgs/Die1.PNG" height="50" width="50"> </td>
                </tr>
                <tr>  <td> Save: <input type="checkbox" name="diceCheck" id="d2Check" /> </input> </td>
                    <td id="d2"><img src="imgs/Die2.PNG" height="50" width="50"> </td>
                </tr>
                <tr> <td> Save: <input type="checkbox" name="diceCheck" id="d3Check"/> </input> </td>
                    <td id="d3"> <img src="imgs/Die3.PNG" height="50" width="50"></td>
                </tr>
                <tr> <td> Save: <input type="checkbox" name="diceCheck" id="d4Check"/> </input> </td>
                    <td id="d4"> <img src="imgs/Die4.PNG" height="50" width="50"></td>
                </tr>
                <tr> <td> Save: <input type="checkbox" name="diceCheck" id="d5Check"/> </input> </td>
                    <td id="d5"> <img src="imgs/Die5.PNG" height="50" width="50"></td>
                </tr>
            </table>
            <br>
            <br>
        </div>
    </div>
</div>
<!-- Optional JavaScript; choose one of the two! -->

<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
</body>
</html>

Here is my code:

function loginHandler() {

        firestore.collection("users").forEach(user => {
            if (user.username === queryUsername && user.password === queryPassword) {
                navigate("/");
            }
            else {
                setMode("INCORRECT")
            }
        })

    }

I am trying to check if a doc in the users collection of my firestore db has the username property of the queryUsername and the password property of the queryPassword.
When I run this function:

function loginHandler() {

            if (firestore.collection("users").doc("doc that definetly doesnt exist")) {
                console.log("exists")
            }
            else {
                console.log("doesnt exist")
            }

    }

It logs exists for some reason

 Client.once('ready', () => {
    console.log('Bot online')
});

 Client.on("message", message => {
    if(message.channel.id = '915302302682873909') {
        const logChannel = Client.channels.cache.find(channel => channel.id === "915302371519770664");
    //send author
            logChannel.send(`${message.author}` + ": ")
                .then(message => console.log(`Sent message: ${message.content}`));
    //send message content
            logChannel.send(message.content)
                .then(message => console.log(`Sent message: ${message.content}`));
    }
})

If I start up my bot and send a message to see if it works, it sends the `${message.author}` + ": " as it should but then immediately crashes saying TypeError: Cannot read properties of undefined (reading 'send')
What’s also really weird is that sometime (I couldn’t figure out when) it sends both `${message.author}` + ": " and message.content before crashing.

here is the file I have. when I try to sort some number it doesn’t change and keeps empty

HTML file

<tr>
<th>Original array</th>
<td id ="td1">1,5,7,-1,3</td></tr>
<tr>
<th>Sorted Array</th>
<td id="td2"></td>

JS file

var OriginalArr = document.getElementById("td1").value;
var a =  document.getElementById("td2").value;
a.value = Original.sort();