Unable to resolve “realm/dist/bundle” from “RealmRealmSchema.js”

first time Realm user trying to set up a React Native app, getting the error above after trying to set subscriptions, previously getting; ”Cannot write to class Produit when no flexible sync subscription has been created”.

Problem happens after I tried:

import {Subscription} from 'realm/dist/bundle';

I did install the lastest version with; npm install [email protected], but I’m still getting the error.

Here’s my code:

const {UUID} = Realm.BSON;
import Realm, {BSON} from "realm";
import {useRealm, useQuery} from '@realm/react';
import {Subscription} from 'realm/dist/bundle';
import React, {useState} from 'react';
import {Text, FlatList, View, Pressable, TextInput, Button} from 'react-native';

class Produit extends Realm.Object {
    static schema = {
        name: 'Produit',
        properties: {
          _id: 'uuid',
          nom: {type: 'string', indexed: true},
          description: 'string',
          prix: 'string',
          image: 'string'
        },
        primaryKey: '_id',
    };
}

export default Produit;

export const Create = () => {
  const realm = useRealm();
  //const produits = useQuery(Produit);
  const [nomProduit, setNomProduit] = useState('');
  const [descProduit, setDescProduit] = useState('');
  const [prixProduit, setPrixProduit] = useState('');
  const [imgProduit, setImgProduit] = useState('');
  const addProduit = () => {
    realm.write(() => {
      realm.create(Produit, {
        _id: new UUID(),
        name: nomProduit,
        description: descProduit,
        prix: prixProduit,
        image: imgProduit
      });
    });
  };
  return (
    <View>
      <Text>Create</Text>
      <TextInput
        onChangeText={setNomProduit}
        value={nomProduit}
        placeholder="Produit name..."
      />
      <TextInput
        onChangeText={setDescProduit}
        value={descProduit}
        placeholder="description.."
      />
      <TextInput
        onChangeText={setPrixProduit}
        value={prixProduit}
        placeholder="prix..."
      />
      <TextInput
        onChangeText={setImgProduit}
        value={imgProduit}
        placeholder="img..."
      />
      <Button
        title="Add Produit"
        onPress={addProduit}
      />
    </View>
  );
};

This is where I am trying to use it:

import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View, Button } from 'react-native';
import React from 'react';
import { useEffect, useState } from 'react';
import { useApp, useRealm, AppProvider, UserProvider, RealmProvider} from '@realm/react';

import { Produit } from './Realm/RealmSchema.js';
import { Create } from './Realm/RealmSchema.js';

export default function App() {

  return (
    <AppProvider id={'application-pam2-ceyvopp'}>
    <UserProvider fallback={LogIn}>
      <RealmProvider
        schema={[Produit]}
        sync={{
          flexible: true,
          initialSubscriptions: {
            update(subs, realm) {
              subs.add(realm.objects(Produit));
            },
          },
        }}>
    <Create/>
    </RealmProvider>
    </UserProvider>
    </AppProvider>
  )
}

Thank you in advance!

How to test multiple missing columns for a generated CSV file to be uploaded to an API using mocha java test

With in my mocha tests, I have data-generation.js file that holds my functions and this code snippet creates my invalid csv.file. This file has 4 missing fields Clientid, recordlocator, last name, first name and email. I have removed this from my function so when the csv generates it will not add these rows which is what I expect for my tests to pass.

Then in my test-spec.js folder I have to test 4 invalid columns that generates the file, and validate if clientID is not there then show me 422 error, but I need to generate this for the other 3 missing columns, how can I manipulate my Data-generation.js folder to generate these scenarios?

Below Test.spec.js

 describe.only("Create Upload without ClientID, recordlocator,lastName,First name and Email Columns ", function (){
      it("Should throw unprocessable Entity Repoonse 422", async function (){
        getCreateUploadsRequestForInvalidColumnsTMCBulkUpload(clientId, clientOrg.id);
          response = await createBulkUploadsTMC({
            fileName: fileDestination,
            token: userAccessToken,
            delimiter: "COMMA",
            quote: "DOUBLE_QUOTE",
            dataResidency: "US",
          });
          expect(response.status).to.eql(422);
        });
        })
      })
    });

Below Data-generation.js folder where my csv gets generated with these columns and rows.

  clientId,
  organizationId
) {
  const data = [];
  const originAirport = "YUL";
  const destinationAirport = "YYR";
  const originRail = "TPA";
  const destinationRail = "WAS";
  const flightNumber = faker.airline.flightNumber();
  const phoneNumber = faker.phone.number("+1878540####");
  const employeeId = faker.string.numeric(5);
  // generate date
  const currentDate = moment();
  const departureDateTime = currentDate.format("YYYY-MM-DDTHH:mm");
  const arrivalDateTime = currentDate.add(2, "days").format("YYYY-MM-DDTHH:mm");
  const hotelName = faker.person.lastName();
  for (let i = 1; i < 6; i++) {
    let rowDetails;
    switch (i) {
      case 1:
        rowDetails = [
          `Organization,Phone Number,Employee ID,Person Type,Flight Origin,Flight Origin Date,Flight Destination,Flight Destination Date,Airline Code,Flight Number,Hotel Nearest Airport,Hotel Check-in Date,Hotel Check-out Date,Hotel Name,Hotel Address,Hotel Latitude,Hotel Longitude,Vehicle Origin,Vehicle Origin Date,Vehicle Destination,Vehicle Destination Date,Vehicle Company Name,Rail Origin,Rail Origin Date,Rail Destination,Rail Destination Date,Rail Carrier Code,Train Number,Action`,
        ];
        break;
      case 2:
        rowDetails = [
          organizationId,
          phoneNumber,
          employeeId,
          "VIP",
          originAirport,
          departureDateTime,
          destinationAirport,
          arrivalDateTime,
          "YUL",
          flightNumber,
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "Create",
        ];
        break;
      case 3:
        rowDetails = [
          organizationId,
          phoneNumber,
          employeeId,
          "VIP",
          "",
          "",
          "",
          "",
          "",
          "",
          originAirport,
          departureDateTime,
          arrivalDateTime,
          hotelName,
          "",
          "48.78",
          "-78.88",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "Create",
        ];
        break;
      case 4:
        rowDetails = [
          organizationId,
          phoneNumber,
          employeeId,
          "VIP",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          originAirport,
          departureDateTime,
          destinationAirport,
          arrivalDateTime,
          "HERTZ",
          "",
          "",
          "",
          "",
          "",
          "",
          "Create",
        ];
        break;
      case 5:
        rowDetails = [
          organizationId,
          phoneNumber,
          employeeId,
          "VIP",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          "",
          originRail,
          departureDateTime,
          destinationRail,
          arrivalDateTime,
          "2V",
          "92",
          "Create",
        ];
        break;
    }
    const row = [...rowDetails];
    data.push(row);
  }
  // Convert data to CSV format
  const csvContent = data.map((row) => row.join(",")).join("n");

  // Specify the file path and name
  const fileNameCSV = "tmc_upload.csv";
  const fileDestination = path.join(
    __dirname + `/../../../../../testData/testFiles/${fileNameCSV}`
  );

  // Write the CSV content to the file
  fs.writeFileSync(fileDestination, csvContent, "utf-8");

  console.log(`CSV file "${fileNameCSV}" created successfully.`);
return fileDestination
}```

JS / Jquery – Dynamically set text value to a Django form choicefield

I have this choicefield in a django form :

forms.py

sales_documents_description_1 = forms.ChoiceField(required=False, choices=list(models_products.objects.values_list( 'id_product','product_denomination')), widget=forms.Select(attrs={'id': 'sales_documents_editable_select_description_1','style': 'width:200px','onchange': 'populate_selected_product(this.id,this.value)'}))

In my template, how do I set this choicefield value by specifiying the text argument (NOT THE VALUE)

I tried with this :

Template.html

 $('#sales_documents_description_1').filter(function() {return $(this).text() == 'Neumann U87';}).prop('selected', true);

or

$("#sales_documents_description_1 option").filter(function(){return$(this).text() == 'Neumann U87';}).prop('selected', true);

But it’s not working.

Any JS or JQuery solution will be ok for me.

Thanks

Form.io dropdown URL response value based on conditional

Form.io dropdown URL API response value based on conditional i need to show the dropdown list
ex: I have list name = CONT only I need to show in the dropdown list where can I write condition

value  = data.filter(item => item.name === "CONT");
[
  {
    "name": "CONT",
    "description": {
      "ar-AE": "حاوية",
      "en-US": "Container"
    },
  },
  {
    "name": "GC",
    "description": {
      "ar-AE": "شحن عام",
      "en-US": "General Cargo"
    },
    "metadata": []
  },
  {
    "name": "CONT",
    "description": {
      "ar-AE": "رورو",
      "en-US": "werwtret"
    },
    "metadata": []
  }
]

How to prevent unused code from being excluded from a bundle?

I have an old project on Laravel with jquery code, I’m trying to transfer it to Vite.
I have a file auth.js with code:

let auth;
$(function () {
    console.log('123');
    auth = {
        email: null, password: null, logIn: function () {
            $(".btn-login").off('click');
....

I use this function in blade template like this:

<script>
        $(document).ready(function () {
            auth.signUp();
            cabinet.showPassword();
        });
    </script>

My webpack config in old project:

const { mix } = require('laravel-mix');
mix.js('resources/assets/js/app.js', 'public/js');
mix.babel(['resources/assets/js/Auth.js','resources/assets/js/Billing.js'], 'public/js/scripts.js');

and it works well.

my vite config:

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [
        laravel({
            input: [
                'resources/css/app.css',
                'resources/js/app.js',
                'resources/js/Auth.js',
            ],
            refresh: true,
        })
]})

after build, I have this in Auth.js:

$(function(){console.log("123")});

how can i build my js code and call these functions from blade templates?

P.S I know about the method with the window, but maybe there is a more correct way?

window.auth = {
   email: null, password: null, logIn: function () {

Properly test JSX element in Stencil (Jest)

We have a big (very customizable) stencil.js component which loads text from a JSON (depending on locale), does several tranformations and eventually displays a dialog.

We have placeholders in the texts, like %MY_LINK_PLACEHOLDER%, which get transformed to branded link components (wrapper for <a>-elements from company branded Stencil library).

So, simplified:
Input (from JSON) "This is my text with a %MY_LINK%."
Output: This is my text with a <corp-link><a href="foo">link</a></corp-link>.

As JSX can’t render the link if it is passed back as a string (or at least I don’t know how), the method that does the replacement returns an Array like this ["This is my text with a", <corp-link><a href="foo">link</a></corp-link> as HTMLElement, "."]
(I’m not sure, if returning the link as HTMLElement is a good idea. I’d gladly take other suggestions!).

So, the “text elements” have the type: string | HTMLElement | Array<string | HTMLElement>

Now, the actual question:
I’m trying to test, that the links get properly replaced.
When logging the element I get something like this:

      '$flags$': 0,
      '$tag$': 'corp-link',
      '$text$': null,
      '$elm$': {},
      '$children$': [
        {
          '$flags$': 0,
   ...

So currently, my (working) test looks like follows:

    expect(jsonText.myText).toContain("%MY_LINK%");
    expect(processedTextObject.myText).not.toContain("%MY_LINK%");
    expect(processedTextObject.myText[1].$tag$).toBe("corp-link");

So far, so good. But I would

  1. Like to have it more flexible/generic
  2. Have the feeling that the typing is not ideal
  3. Don’t think that using the $-enclosed properties ($tag$) is a good idea

Any suggestions to improve this?
Thanks a lot! 🙂

Pulling Data from Messari with API key into Google Sheets

My JavaScript shows no errors in the logs but when I have input the function into Google Sheets my cell returns a blank. Here is the code:

function getFullyDilutedMarketCap(ticker) {
if (!ticker || typeof ticker !== 'string') {
return 'Error: Invalid ticker symbol provided';
}

const apiKey = 'Your Messari API key'; //
const url = https://data.messari.io/api/v1/assets/${ticker}/metrics/market-data;

const options = {
'method': 'get',
'headers': {
'x-messari-api-key': apiKey
}
};

try {
const response = UrlFetchApp.fetch(url, options);
const data = JSON.parse(response.getContentText());

    if (data.status && !data.status.error_code) {
      return data.data.market_data.marketcap_diluted_usd; // Return the fully diluted market cap in USD
    } else {
      return `Error: Ticker not recognized or API issue`;
    }

} catch (error) {
return Error fetching data: ${error.message};
}
}

function fetchFullyDilutedMarketCap(ticker) {
const marketCap = getFullyDilutedMarketCap(ticker);

const sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
sheet.getRange('A1').setValue('Fully Diluted Market Cap (USD)');
sheet.getRange('B1').setValue(marketCap);
}

Used ChatGPT to amend the code but I cannot get it to stop displaying blank cells.

How to put a game with multiple .swf (characters, audio, assets…) in Ruffle?

I’m trying to bring back an entire website from 2010 and its flash games with ruffle (https://onlinewinxclub.com/centro-web/?lang=en) and so far so good, even for someone like me who never really worked with flash, I changed a few scripts regarding the highscore in 5 other games to point to the my server instead of the old website and all the games followed the same logic thus far: all files inside their folders, the .xml for the languages and one .swf for the game only…

However, one of the games, which also happened to be the most successful one back then, has multiple .swf files that need to be pre-loaded and I have no clue how to run it. The “game.swf” which is in charge of everything doesn’t load past… the loading.

Is anyone able to do it? I was planning on releasing the website in a few weeks and this is actually the last thing I need to finish before finally releasing it and it’s unfortunately with the area I have less experience with – flash.

Here is the drive file with the game: https://drive.google.com/file/d/10XEXJ2VFfL8rBVsRPSTWsB_FsGQTrPuP/view

The MinigamePlayer.php is where I run the game. https://onlinewinxclub.com/centro-web/pages/Games/Flash/IceCream/MiniGamePlayer.php?lang=en

I tried a bunch of things.

First I went to waybackmachine to the old official website and see how their own code was:

<html>
<body style="background-color: black; text-align: center;">
    <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="920" height="575" class="minigame-object" id="minigame-object" align="middle">
                    <param name="movie" value="MinigameWrapper.swf?lang=en">
                    <param name="base" value=".">
                    <param name="quality" value="high">
                    <param name="bgcolor" value="#ffffff">
                    <param name="allowFullScreen" value="true">
                    <param name="allowScriptAccess" value="always">
                    <param name="wmode" value="opaque">
                    <param name="FlashVars" value="gameId=8&amp;languageId=1&amp;userId=0&amp;sessionId=">
                    <!--[if !IE]>-->
                    <object type="application/x-shockwave-flash" data="MinigameWrapper.swf?lang=en" width="920" height="575" class="minigame-object" id="minigame-object" align="middle">
                        <param name="movie" value="MinigameWrapper.swf?lang=en">
                        <param name="base" value=".">
                        <param name="quality" value="high">
                        <param name="bgcolor" value="#ffffff">
                        <param name="allowFullScreen" value="true">
                        <param name="allowScriptAccess" value="always">
                        <param name="wmode" value="opaque">
                        <param name="FlashVars" value="gameId=8&amp;languageId=1&amp;userId=0&amp;sessionId=">
                        <!--<![endif]-->
                        <div class="FlashFallback">
                            <p>You need Flash plugin to play this game</p>
                        </div>
                        <!--[if !IE]>-->
                    </object>
                    <!--<![endif]-->
    </object>
</body>
</html>

This was it, but it didn’t help at all because it didn’t really have anything that different from what I have myself, which is:

MinigamePlayer.php:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Play Game</title>
    <script src="/ruffle/ruffle.js"></script> <!-- Path to Ruffle -->
    <script>
        document.addEventListener("DOMContentLoaded", function() {
            const langMap = {
                'en': 1,
                'it': 2,
                'fr': 3,
                'es': 6,
                'de': 7,
                'pt': 9
            };

            function getQueryParam(param) {
                const urlParams = new URLSearchParams(window.location.search);
                return urlParams.get(param);
            }

            const lang = getQueryParam('lang');
            const languageId = langMap[lang] || 1; 

            if (!window.gameLoaded) {
                const swfFiles = [
                    "game8/assets.swf",
                    "game8/characters.swf",
                    "game8/audio.swf",
                    "game8/interface.swf",
                    "game8/levels.xml"
                ];

                // Preload the SWF files
                swfFiles.forEach(function(file) {
                    const preloadObject = document.createElement("object");
                    preloadObject.setAttribute("type", "application/x-shockwave-flash");
                    preloadObject.setAttribute("data", file);
                    preloadObject.style.display = "none";
                    document.body.appendChild(preloadObject);
                });

                var gameContainer = document.createElement("object");
                gameContainer.setAttribute("id", "minigame-object");
                gameContainer.setAttribute("type", "application/x-shockwave-flash");
                gameContainer.setAttribute("data", "../../../../pages/Games/Flash/IceCream/MinigameWrapper.swf?gameId=8&amp;languageId=${languageId}&amp;userId=0&amp;sessionId=");
                gameContainer.setAttribute("width", "750");
                gameContainer.setAttribute("height", "480");

                gameContainer.setAttribute("style", "outline: 1px solid #7E7F7F;");

                gameContainer.innerHTML = `
                    <param name="base" value=".">
                    <param name="quality" value="high">
                    <param name="bgcolor" value="#ffffff">
                    <param name="allowFullScreen" value="true">
                    <param name="allowScriptAccess" value="always">
                    <param name="wmode" value="opaque">
                    <param name="FlashVars" value="gameId=8&amp;languageId=${languageId}&amp;userId=0&amp;sessionId=">
                    <div>
                        <p>You need Ruffle to play this game. <a href="https://ruffle.rs/#downloads" target="_blank">Download Ruffle here</a>.</p>
                    </div>
                `;

                document.body.appendChild(gameContainer);
                window.gameLoaded = true;
            }
        });
    </script>
</head>
<body>
</body>
</html>

I tried the preload of the files as you can see, but this appears on the console:

ERROR core/src/avm2/events.rs:433 Error dispatching event
EventObject(EventObject { type: “complete”, class:
flash.events::Event, ptr: 0x13ab200 }) to handler
FunctionObject(FunctionObject { ptr: 0x10111c8, name:
Ok(“components::GameBase/handleXMLLoaderComplete()”) }) : TypeError:
Error #1009: Cannot access a property or method of a null object
reference. (accessing field: playBtn) at
com.rm.icecream.ui::PauseScreen/initialize() at
com.rm.icecream::Game/initialize() at
components::GameBase/loadOrInitialize() at
components::GameBase/handleXMLLoaderComplete()
core.ruffle.4165d85befd59ccf80e4.js:1 [Violation]
‘requestAnimationFrame’ handler took 107ms
core.ruffle.4165d85befd59ccf80e4.js:1 [Violation]
‘requestAnimationFrame’ handler took 91ms
core.ruffle.4165d85befd59ccf80e4.js:1 [Violation]
‘requestAnimationFrame’ handler took 97ms

I also tried to search for any old website that still had the games there. 99% of them used the official website’s URL path, and the website closed in 2012. But I found one website, the only one, that actually has the game somehow running smoothly, but I wasn’t able to understand what they did

https://www.numuki.com/include/js/waflash/default/?loadurl=https://media.numuki.com/winx-club/games/game8/game.swf?lang=en&gameId=8&languageId=1&userId=0&sessionId=

Beginner Javascript – return function nightmare [closed]

I’m trying not to use the alert() function and instead create my own message. I have built a quiz, but when I test the error message, it works but won’t move on to the next question. I feel like it has something to do with the return statement but no matter where I put it, something else fails.
Could someone point me in the right direction? I’ve checked here, W3Schools, Shecodes, ChatGPT etc

if (submitButton) {
        submitButton.addEventListener("click", function () {
            var error = document.getElementById("error");
            
            if (!answerSelected && submitButton.innerText !== "Play Again?") {
                error.innerHTML = "<span style='color: red;'>" +
                    " Please choose an answer to proceed! ";
                // return;
            } else {
                //error = document.getElementById("error");
                error.style.display= "none";
            }

            if (submitButton.innerText === "Play Again?") {

                resetQuiz();
            } else {
                currentQuestion++;

                if (currentQuestion < questions.length) {
                    showQuestion();
                } else {
                    showResult();
                }
            }
        });
    }

I tried putting the return statement after the first else statement, but it just terminated early. I tried without any return statement and that just allows users to click “Next” without answering and no error message displays. I’m at a loss.

Getting Error of PODS while creating new react native project on windows

Im windows user, my previous and existing projects are running smoothly I’m getting this error while craeting new project im also unable to craete/run android file/projects even if i ignore pods

Welcome to React Native 0.75.0!
Learn once, write anywhere
x Downloading template
error Installing pods failed. This doesn’t affect project initialization and you can safely proceed.
However, you will need to install pods manually when running ios, follow additional steps in “Run instructions for ios”
section.
Run instructions for Android:
• Have an Android emulator running (quickest way to get started), or a device connected.
⚫ cd “C:UsersrazarRN Projectsloginscreens” && npx react-native run-android
Run instructions for Windows:
• See https://aka.ms/ReactNativeGuideWindows for the latest up-to-date instructions.

tried chatgpt
uninstalled/installed -g @react-native-community/cli
npm cache clean –force

Checking if object already exists in another array before adding it

I have an array of objects (opciones) and another array (visibles) where im trying to add the objects that are supposed to show up.

 function next(ev, next) {
    ev.preventDefault();
    setToggle(next.siguiente);
    let element = document.getElementById(next.siguiente);
    opciones.map(
      (opcion) => opcion.id === next.siguiente && visibles.push(opcion)
    );
  }

Next is the current object i’m passing onClick/submit.
SetToggle: i set visibility of the component i want to show.
next.siguiente – the next component ID that has to show up after this function is finished.
opciones – my initial array of objects
**visibles **- the array where i add the selected objects
and in my opciones.map function i’m trying to detect if the next component ID exists in the opciones array i want to push it into visibles array.
It works but im obviously getting duplicates the way i’m doing it right now.

This is my opciones object for better understanding:

  const opciones = [
    {
      id: "TAB_inicio",
      texto: "Inicio",
      visibilidad: "",
      siguiente: "TAB_incluido",
      descripcionTitulo: "Bienvenido al programa de carga de Viajes",
      descripcion: "Selecciona lo que quieras hacer",
      icon: <FaCheckCircle />,
      next: next,
      contenido: <Inicio />,
      botonSiguiente: "Nuevo Viaje",
    },
    {
      id: "TAB_descripcion",
      texto: "Descripción",
      visibilidad: "hidden",
      siguiente: "TAB_prueba",
      descripcionTitulo: "Descripcion",
      descripcion: "detalles importantes",
      icon: <FaBookOpen />,
      next: next,
      contenido: <Descripcion />,
      botonSiguiente: "Siguiente",
    },
    {
      id: "TAB_incluido",
      texto: "Incluido / no",
      visibilidad: "hidden",
      siguiente: "TAB_descripcion",
      descripcionTitulo: "Incluido/ No incluido",
      descripcion:
        "Si el servicio no está seleccionado, el cliente lo verá como no incluido.",
      icon: <FaCheckDouble />,
      next: next,
      contenido: <Incluido />,
      botonSiguiente: "Siguiente",
    }
  ];

So pretty much siguiente would be the ID of the next object / component i want to display.
How would i be able to check if visibles already has the added object before i add it again?
i tried something like:

 function next(ev, next) {
    ev.preventDefault();
    setToggle(next.siguiente);
    let element = document.getElementById(next.siguiente);
    if (visibles.includes(next)) {
      console.log("already exists");
    } else {
      opciones.map(
        (opcion) => opcion.id === next.siguiente && visibles.push(opcion)
      );
    }
  }

but it doesn’t really work. I’m getting duplicated keys when displaying the list and it keeps adding to the array.
Any help or recommendation in general to improve this would be appreciated! Thank you in advance.

Firebase is not defined error when initializing firebase

I was following a tutorial and ReferenceError: firebase is not defined keeps poping up

I tried following some past question on stackOverflow but was not able to solve this. please tell me if i am doing something wrong

   <script src="https://www.gstatic.com/firebasejs/13.15.1/firebase-app.js"></script>
   <script src="https://www.gstatic.com/firebasejs/13.15.1/firebase-auth.js"></script>
   <script src="https://www.gstatic.com/firebasejs/13.15.1/firebase-firestore.js"></script>
   <script>
     // Initialize Firebase
     const firebaseConfig = {
        apiKey: "AIzaSyDdM1wifQDRC5Yx1lqiMbMXHhas_gQtgog",
        authDomain: "notes-project-e1952.firebaseapp.com",
        projectId: "notes-project-e1952",
        storageBucket: "notes-project-e1952.appspot.com",
        messagingSenderId: "730725354888",
        appId: "1:730725354888:web:b51688d6904jdvnjsb87e3d",
        measurementId: "G-4FJRM2XQW5"
        };

        // Initialize Firebase
        firebase.initializeApp(firebaseConfig);
   
        // Make auth and firestore references
        const auth = firebase.auth();
        const db = firebase.firestore();
   </script>
   
  <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
  <script src="scripts/auth.js"></script>
  <script src="scripts/index.js"></script>

It is posible detect when recaptcha v2 image challange showed?

I have this file to show rectapcha v2 and I need to detect that recaptcha show image challange. This html is displayed in flutter application and I need that capture to enlarge the webview where the recaptcha is displayed


    <script src="https://www.google.com/recaptcha/api.js" async defer></script>
    <script>
    
        function onLoad() {

          grecaptcha.render('recaptcha', {
            'sitekey': '<KEY>', 
            'callback': onSuccess,        
            'expired-callback': onExpired, 
            'error-callback': onError      
          });
        }
  
    function onSuccess(token) {
        alert('Verification successful!');
            if (window.Captcha) {
                window.Captcha.postMessage('success');
            }
       
    }

    function onExpired() {
        console.log("reCAPTCHA expired");
        if (window.Captcha) {
          window.Captcha.postMessage("expired");
        }
    }

    function onError() {
        console.log("reCAPTCHA error or challenge");
        if (window.Captcha) {
          window.Captcha.postMessage("error");
        }
    }

    function onChallangeOpen() {
        if (window.Captcha) {
          window.Captcha.postMessage("challenge");
        }
    }
    </script>

Errors in fetching Data on MongoDB

Hello ive been having an issue with my webApp . My homepage cant fetch data from the backend . ive have a js file at the backend name studentRecords that populate details from the data models but when i try login with my admission number . The response is that it has fail to fetch the student records. Any assistance in this will be highly appreciated .[This is my home componentHere is my studentRecords.js](https://i.sstatic.net/4hvTx6GL.png)

Home page I tried debugging the studentRecords.js file but ive not been able to solve the issue . And what i expected is that after i logged in with my admission number at the login page , I’m able to see the student records at the home component . But it has hasn’t work.

clone array of jquery/html elements

I have to clone some table rows. I only can select this rows based on their indexes. I can’t use any common class or attribute to select the rows in one shot.

I do this like this:

const rows: JQuery<HTMLElement>[] = [];
      for (let i = 0; i <= rowIndexes!.length - 1; i++) {
        const row = $(
          `tr[ng-reflect-data-row-index='${rowIndexes![i]}'`
        );
        rows.push(row);
      }

And after this I want to clone the rows array like this:

$(rows).clone()

But with this I get the error TypeError: e.cloneNode is not a function.

So, the question is, how can I clone this array as a jquery element? After clone I want to do some other operations on it, f.e. animate, wrapAll.

Thanks.