How do webdevelopers create “background search” websites that appear to be running a long difficult search?

There are a number of paywall websites that are designed to allow the user to find out public record information about individuals. When the user enters some basic information about the individual and submits the search, a status bar appears and the websites begins flipping through blurred out photos, to signify that a large search is being executed.

How to build a regex match for these keywords?

I’m trying to build a regex that would detect a group of keywords in an sentence.

For ex: I want to detect need a team or need a hand in these two sentences

  • I need a team to help me with my homework
  • They are going to need a hand to fix that door

I have something like this: /(need a team) | (need a hand)/gmi but it does not work.
Thank you

Reset form using AvForm in react js

I am using AvForm in React js. I want to reset the form after form Submission. But I am unable to reset the code unless I refresh the whole page. Whenever the form submits it retains the old value but not reset the fields

form.js

<AvForm
    className="form-horizontal"
    onValidSubmit={(e, v) => {
      const data = { ...formData, ...v };
      setFormData({ ...data });
      dispatch(
        createMarketplaceAccount(
          {
            name: data.name,
            access_id: data.access_id,
            access_secret: data.access_secret,
            marketplace: "amazon",
            aws_credentials: {
              marketplaces: data.marketplaces.split(","),
            },
            account_id: getUserInfo().account_id,
            informed_api_key: data.informed_api_key,
          },
        ),
      );
      toggleTabProgress(3);
      toggleTab(3);
    }}
  >
    <div className="form-group">
      <AvField
        name="access_id"
        label="Amazon Seller ID:"
        value=""
        className="form-control"
        placeholder="ABC123DE456F78"
        type="text"
        required
      />
    </div>
    <div className="form-group">
      <AvField
        name="access_secret"
        label="MWS Auth Token:"
        value=""
        className="form-control"
        placeholder="amzn.mws.123e4567-e89b-12d3-a456-426655440000"
        type="text"
        required
      />
    </div>

    <ul className="pager wizard twitter-bs-wizard-pager-link">
      <li
        onClick={() => {
          toggleTabProgress(1);
        }}
        className="btn btn-primary w-md btn-sm waves-effect waves-light"
      >
        Previous
      </li>
      <li className={activeTabProgress === 4 ? "next disabled" : "next"}>
        <button type="submit" className="btn btn-primary w-md btn-sm waves-effect waves-light">
          Next
        </button>
      </li>
    </ul>
  </AvForm>

I need help. Thank you in advance. I need some suggestions

How Can I Reset to the Initial Value of Slider in D3 JS? I was trying that but When it set Initial Value the Play Button does not work properly

//reset slider functionality code in d3 js
// here we adding event for our resetButton on “click” event it should reset slider to initial value or date or year
resetButton.on(“click”, function () {
if (clearInterval(timer)) {
playButton.text(“Play”);
document.getElementsByClassName(“slider”).value = curDate.setDate(startDate);
} else if (timer = setInterval(step, 500)) {
playButton.text(“Pause”);
document.getElementsByClassName(“slider”).value = curDate.setDate(startDate);
} else {
document.getElementsByClassName(“slider”).value = curDate.setDate(startDate);
}
});

Obtaining value and setting new value using one function for different input fields

Using vue, I have five input fields for different categories. I want to pass each input field into one function, manipulate the value, and then assign the updated value to the original input name.

<q-input
    v-model="categoryOne"
    name="categoryOne"
    @change="onSelected($event, categoryOne)"
></q-input>
 <q-input
    v-model="categoryTwo"
    name="categoryTwo"
    @change="onSelected($event, categoryTwo)"
></q-input>


function onSelected(event, category) {
   //how would I take the input of each category and perform an 
   action that updates the original value? For example:

    [categoryOne/categoryTwo] = category + 2.
    }

Async function returns promise after .thne

In my code, I have an async function that returns a promise.I am aware that this question has been asked before, however none of the solutions worked.

const fetch = require('node-fetch');
async function getData() {
  const response = await fetch(url);
  return (await response.json());
}
getData().then( // wait until data fetched is finished
  console.log(getData())
)

Thank you in advance

ReactJS Library being used in NextJS project says is not a constructor

I have built a ReactJS library and published to NPM and works fine in a standard ReactJS project, but I now have a NextJS and I am trying to add it there, I expected it would just work as NextJS is a framework on top of ReactJS with some additional functionality.

In the app.js I have the following:

import dynamic from 'next/dynamic'
import {useEffect} from "react";

function MyApp({ Component, pageProps }) {

    const {CrashCatch, CrashCatchProvider} = dynamic(import('crashcatchlib-reactjs'), { ssr: false })

    let crash_catch = new CrashCatch();

    crash_catch.initialiseCrashCatch("12978650", "d7kqcewvshoyxbp564f8tm0zl", "1.0.1");

    return (
       ....
    ) 
}

When running this I get TypeError: CrashCatch is not a constructor

I have tried not using a dynamic import and doing a standard import as import {CrashCatch, CrashCatchProvider} from "crashcatchlib-reactjs"; but then I get the error SyntaxError: Cannot use import statement outside a module]

The source code for the reactjs library is open source so its available on GitHub at https://github.com/Crash-Catch/CrashCatchLib-ReactJS. The index.js has the class CrashCatch which has the constructor so not sure why NextJS is treating it differently.

TVJS – Search functionality crashes when trying to show results

I’m working on a TVML application. One of the screens shows a search form for the user to enter a keyword. The text entered is compared to a previously existing JSON file that contains every item in existence. After the available results are filtered, these are used to build XML nodes by using an external XML file, and then they are imported into the search document, specifically into the section with Id “results”. The problem is that if I just type a search term directly, the search takes place. However, if I type letter by letter (allowing for a search after each letter) then the application crashes and I get the following error:

*** Terminating app due to uncaught exception 'NSRangeException', reason: '*** -[__NSSingleObjectArrayI objectAtIndex:]: index 1 beyond bounds [0 .. 0]'
terminating with uncaught exception of type NSException

(the index number and the range vary with different results)

Here are the files I currently have:

search.tvml

<?xml version="1.0" encoding="UTF-8" ?>
<document>
<head>
    <style>
        .company {
            font-size: 26;
        }
    </style>
</head>
<searchTemplate>
    <searchField />
    <collectionList>
        <grid>
            <header>
                <title>Search Results</title>
            </header>
            <section id="results">
                
            </section>
        </grid>
    </collectionList>
</searchTemplate>
</document>

searchResults.tvml

<lockup template="video.tvml" presentation="push" id="{{id}}">
    <img src="https://path_to_images/{{path}}/{{image}}.jpg" width="380" height="266" alt="{{name}}"/>
    <title>{{name}}</title>
    <subtitle class="company">{{company}}</subtitle>
</lockup>

SearchHandler.js

class SearchHandler {
    constructor(resourceLoader) {
        this._resourceLoader = resourceLoader;
        this.searchDatabase = "";
    }

    enableSearchForDoc(doc) {
        this._addSearchHandlerToDoc(doc);
    }

    _addSearchHandlerToDoc(doc) {
        var searchFields = doc.getElementsByTagName('searchField');
        for (var i = 0; i < searchFields.length; ++i) {
            var searchField = searchFields.item(i);
            var keyboard = searchField.getFeature("Keyboard");
            keyboard.onTextChange = this._handleSearch.bind(this, keyboard, doc);
        }
    }


    _handleSearch(keyboard, doc) {
    
        // Get the text entered
        var searchString = keyboard.text;
    
        // Blank results array
        var results = [];
    
        // Search only if text entered has more than one character
        if (searchString.length > 1) {
            results = this.searchVideosForString(searchString, this.searchDatabase);
        }
    
        // Get the result nodes (lockups) from the results obtained
        var resultNodes = this._renderResults(results);
    
        // Get a reference to the "results" section in search.tvml
        var resultContainer = doc.getElementById("results");
    
        // If such section exists
        if (resultContainer) {
            // remove previous results
            while (resultContainerChildren > 0 ) {
                resultContainer.removeChild(resultContainer.lastChild);
                resultContainerChildren--;
            }
        
            // Add each lockup node to the results section
            if (resultNodes.length > 0) {
                resultNodes.forEach(function(resultNode) {
                    doc.adoptNode(resultNode);
                    resultContainer.appendChild(resultNode);
                });
            }
        }
    }

    _renderResults(results) {
        var resourceLoader = this._resourceLoader;
    
        // Get an XML node (lockup) for each of the results found
        // Results will be used as data for the XML
        var rendered = results.map(function(result) {
            var doc = resourceLoader.getRenderedDocument("searchResults.tvml", result);
            return doc.documentElement;
        });
    
        // Return the array of lockup nodes
        return rendered;
    }

    searchVideosForString(searchString, data) {
        var sourceData = data;
    
        var results = []
    
        results = sourceData.filter(function(v) {
            var title = v.name;
            var show = v.showname;
            var company = v.company;
                                    
            return title.toLowerCase().includes(searchString.toLowerCase()) || show.toLowerCase().includes(searchString.toLowerCase()) || company.toLowerCase().includes(searchString.toLowerCase())
        });

        console.log("SEARCH RESULTS: ", results);

        return results;
    }
}

I have been monitoring the results of the searchVideosForString method using the Safari console, and what I have discovered is, if for example I’m trying to search for “Parry” which exists in the full results, if I type in the word “Par”, the console shows for Search Results an array with 18 objects. If I open the disclosure triangle, it shows each of those 18 objects. If I then add a character in the search to look for “Parr”, then the app crashes. The console shows for Search Results an array with 1 object, but if I open the disclosure triangle, it’s empty, I can’t see what the actual object is.

I have tried deleting sections of the code in the handleSearch method. If I remove everything below

var resultContainer = doc.getElementById("results");

then I can enter any text in the search box without any issues and the console shows the appropriate search results, no matter how many they are.

It seems the problem happens in this line:

doc.adoptNode(resultNode);

but I can’t figure out why nor where that index out of range exception is coming from.

req.user is coming back as undefined with Express and Passport?

When my app redirects to “/” req.user is undefined, but in the twitter callback, req.user gives me the data that I’m looking for. I lose the data on redirect. There is still information in req for “/” but not req.user which I need.

Can anyone help me solve this problem?

This is my index.js

const express = require('express')
const app = express()
const cookieSession = require('cookie-session')
const passport = require('passport');
require('./passport')
const isLoggedIn = require('./Middleware/auth')

app.use(cookieSession({
  name: 'twitter-auth-session',
  keys: ['key1', 'key2']
}))
app.use(passport.initialize());
app.use(passport.session());

app.get('/auth/error', (req, res) => res.send('Unknown Error'))


//, isLoggedIn,

app.get('/', (req,res)=>{
  console.log('HELLOOOOO', req.user)
  res.send(`Hello`)
});

app.get('/logout', (req, res) => {
  req.session = null;
  req.logout();
  res.redirect('/');
})

app.get('/auth/twitter',passport.authenticate('twitter'));
app.get('/auth/twitter/callback',passport.authenticate('twitter', { failureRedirect: '/auth/error' }),
function(req, res) {
  // console.log("REQUEST", req.user)
  res.redirect('/');
});

app.listen(8000,()=>{
  console.log('Server is up and running at the port 8000')
})

This is my passport.js middleware:

const passport = require('passport');
const TwitterStrategy = require('passport-twitter').Strategy;

passport.serializeUser(function(user, done) {
  done(null, user);
});

passport.deserializeUser(function(user, done) {
  done(null, user);
});

passport.use(new TwitterStrategy({
  consumerKey: "xxxxxxxxxxx",
  consumerSecret: "xxxxxxxxxxx",
  callbackURL: "http://www.localhost:8000/auth/twitter/callback",
}, function(accessToken, refreshToken, profile, cb) {
  return cb(null, profile);
}));

await Asyncstorage returns a promise

I am using a helper function to get the token from Asyncstorage and add it to the axios header but instead it gives a promise. My function is like this:

const getToken = async () => {
  const token = await AsyncStorage.getItem("token")
    return token
};

Discord.js something-random-on-discord meme API not working: DiscordAPIError: Cannot send an empty message

I am new to working with APIs in discord.js and I stumbled across a meme API in npm (https://www.npmjs.com/package/something-random-on-discord). I followed the exact steps on the site and got this error:

/home/runner/Penguin69/node_modules/discord.js/src/rest/RequestHandler.js:349
      throw new DiscordAPIError(data, res.status, request);
            ^

DiscordAPIError: Cannot send an empty message
    at RequestHandler.execute (/home/runner/Penguin69/node_modules/discord.js/src/rest/RequestHandler.js:349:13)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async RequestHandler.push (/home/runner/Penguin69/node_modules/discord.js/src/rest/RequestHandler.js:50:14) {
  method: 'post',
  path: '/channels/914839917769658371/messages',
  code: 50006,
  httpStatus: 400,
  requestData: {
    json: {
      content: undefined,
      tts: false,
      nonce: undefined,
      embeds: undefined,
      components: undefined,
      username: undefined,
      avatar_url: undefined,
      allowed_mentions: undefined,
      flags: undefined,
      message_reference: undefined,
      attachments: undefined,
      sticker_ids: undefined
    },
    files: []
  }
}

my code was:

const random = require("something-random-on-discord").Random
client.on("messageCreate", message => {
 if (message.content.toLowerCase() === "!meme") {
 let data = await random.getMeme()
    message.channel.send(data)
  };
});

Does this have something to do with me using discord.js v13? If so, is there any other meme API/generator that works? Hope someone can help!

Crawling any webpage with HtmlUnit not working with Javascript pages

I am developing a web crawler able to recieve any given domain and crawl the main page, then creating a list with all the sub links of that page and crawl them too.

I programmed the part of retrieving the main content of any given page, for that I used HtmlUnit to get the html, and boilerpipe to identify the main content with pretty accurate results.

Now I’m facing the problem of having to identify all the sub-links of that page, the biggest deal here is the fact that every webpage has it’s own html structure. I’ve tried to accomplish that with the following methods:

  • Searching all the Anchors (a): this was my first idea and worked
    pretty well, the problem came when I tried to crawl pages that
    implement JavaScript, as they wont use Anchor tags but (div) tags
    with onClick properties:
    (onclick=”widgetEvCall(‘handlers.openResult’, event, this,
    ‘/Attraction_Review-g187497-d670716-Reviews-Barcelona_Bus_Turistic-Barcelona_Catalonia.html’)
  • Search all the tags with onCLick attributes: this solution didnt work
    either as not all the webs use that attribute.
  • Get the button.click() response: The problem here was that not all
    the elements that have link redirect on them are buttons, some of
    them are just divs.

I know that JSoup can do that pretty easily but it crashes when finding JavaScript elements. At this point I ran out of ideas, anyone could help me with this task?

Is there a way to identify and resolve this function error? TypeError: user.reserve is not a function

I’m new to backend programming, I’m following a course to test some tests, and I get the following error: Is there a way to identify and resolve this function error? TypeError: user.reserve is not a function

var mongoose = require('mongoose');
var Equinero = require('../../models/equinero');
var Usuario = require('../../models/usuario');
var Reserva = require('../../models/reserva');

describe("Testing Usuarios", function() {

  beforeEach(function(done) {
    mongoose.connection.close().then(() => {
      var mongoDB = 'mongodb://localhost/testdb';
      mongoose.connect(mongoDB, { useNewUrlParser: true, useUnifiedTopology: true });
      
      var db = mongoose.connection;
      db.on('error', console.error.bind(console, 'connection error: '));
      db.once('open', function () {
        console.log('We are connected to test database!');
        done();
      });
    });
  });

  afterEach(function(done) {
    Reserva.deleteMany({}, function(err, success) {
      if (err) console.log(err);
      Usuario.deleteMany({}, function(err, success) {
        if (err) console.log(err);
        Equinero.deleteMany({}, function(err, success) { 
          if (err) console.log(err);
          done();
        });
      });
    });
  });

 
  describe("Cuando un Usuario reserva una bici", () => {
    it("Debe existir la reserva", (done) => {
      const usuario = new Usuario({nombre: 'Ezequiel'});
      usuario.save();
      const equinero = new Equinero({code:1, material: 'cemento', profundidad: '1m', dc: '2m'});
      equinero.save();

      var hoy = new Date();
      var maniana = new Date();
      maniana.setDate(hoy.getDate()+1);
      usuario.reservar(equinero.id, hoy, maniana, function(err, reserva) {
        Reserva.find({}).populate('equinero').populate('usuario').exec(function(err, reservas) {
          console.log(reservas[0]);
          expect(reservas.length).toBe(1);
          expect(reservas[0].diasDeReserva()).toBe(2);
          expect(reservas[0].equinero.code).toBe(1);
          expect(reservas[0].usuario.nombre).toBe(usuario.nombre);
          done();
        });
      });

    });
  });

});

I am using spec, jasmine, node js, express