Category: javascript

I am using ASP Razor Page and trying to bind dynamically dropdown list from backend code then filter select option via jQuery, i try below code, everything works fine, but after run edit button and bind drop-down list for two times, for third times the Drop-Down List(HTML Select Tag) doesn’t bind with value, And Filter not work correctly.

var Password ="";
var Province ="";
function EditUser(element1) {
     Password = $(element1).closest('div.dropdown-menu').find(".UpdateClassPassword").val();
     Province = $(element1).closest('div.dropdown-menu').find(".UpdateClassProvince").val();
}
    $("#EditProvince").find("option").filter(function () {                
            return this.innerHTML == Province;            
     }).attr("selected", true); 
    EidtFunc($('#EditProvince').val());
    $("#EditCity").find("option").filter(function () {
        return this.innerHTML == City;
    }).attr("selected", true);

    function EidtFunc(State) {
        var _Shahrestan = document.getElementById("EditCity");
        _Shahrestan.options.length = 0;
        if (State != "") {
            var arr = State.split(",");
            for (i = 0; i < arr.length; i++) {
                if (arr[i] != "") {
                    _Shahrestan.options[_Shahrestan.options.length] = new Option(arr[i], arr[i]);
                }
            }
        } 
        $('#EditProvinceName').val($('#EditProvince option:selected').text());
    }
  function EditSwapVale1() {
      $('#EditCityName').val($('#EditCity option:selected').text());        
  }

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<a href="#" onclick="EditUser(this); return false;" class="dropdown-item">ویرایش</a>
<input type="hidden" name="EditCityName" id="EditCityName" value="" />
<input type="hidden" name="EditProvinceName" id="EditProvinceName" value="" />
    <input type="hidden" value="@row[12]" class="UpdateClassProvince" />
    <input type="hidden" value="@row[13]" class="UpdateClassCity" />
    <select id="EditProvince" name="EditProvince" class="form-select" onchange="EidtFunc(this.value)">
            <option value=""></option>
            <option value="  ,آذرشهر ,اسکو ,اهر ,بستان‌آباد ,بناب ,تبریز ,جلفا ,چاراویماق ,سراب ,شبستر ,عجب‌شیر ,کلیبر ,مراغه ,مرند ,ملکان ,میانه ,ورزقان ,هریس ,هشترود">آذربایجان شرقی</option>
            <option value="  ,ارومیه ,اشنویه ,بوکان ,پیرانشهر ,تکاب ,چالدران ,خوی ,سردشت ,سلماس ,شاهین‌دژ ,ماکو ,مهاباد ,میاندوآب ,نقده">آذربایجان غربی</option>
            <option value="  ,اردبیل ,بیله‌سوار ,پارس‌آباد ,خلخال ,کوثر ,گِرمی ,مِشگین‌شهر ,نَمین ,نیر">اردبیل</option>
            <option value="  ,آران و بیدگل ,اردستان ,اصفهان ,برخوار و میمه ,تیران و کرون ,چادگان ,خمینی‌شهر ,خوانسار ,سمیرم ,شهرضا ,سمیرم سفلی ,فریدن ,فریدون‌شهر ,فلاورجان ,کاشان ,گلپایگان ,لنجان ,مبارکه ,نائین ,نجف‌آباد ,نطنز">اصفهان</option>
            <option value="  ,آبدانان ,ایلام ,ایوان ,دره‌شهر ,دهلران ,شیروان و چرداول ,مهران">ایلام</option>
            <option value="  ,بوشهر ,تنگستان ,جم ,دشتستان ,دشتی,دیر ,دیلم ,کنگان ,گناوه">بوشهر</option>
            <option value="  ,اسلام‌شهر ,پاکدشت ,تهران ,دماوند ,رباط‌کریم ,ری ,ساوجبلاغ ,شمیرانات ,شهریار ,فیروزکوه ,کرج ,نظرآباد ,ورامین">تهران</option>
            <option value="  ,اردل ,بروجن ,شهرکرد ,فارسان ,کوهرنگ ,لردگان">چهارمحال و بختیاری</option>
            <option value="  ,بیرجند ,درمیان ,سرایان ,سربیشه ,فردوس ,قائنات,نهبندان">خراسان جنوبی</option>
            <option value="  ,بردسکن ,تایباد ,تربت جام ,تربت حیدریه ,چناران ,خلیل‌آباد ,خواف ,درگز ,رشتخوار ,سبزوار ,سرخس ,فریمان ,قوچان ,کاشمر ,کلات ,گناباد ,مشهد ,مه ولات ,نیشابور">خراسان رضوی</option>
            <option value="  ,اسفراین ,بجنورد ,جاجرم ,شیروان ,فاروج ,مانه و سملقان">خراسان شمالی</option>
            <option value="  ,آبادان ,امیدیه ,اندیمشک ,اهواز ,ایذه ,باغ‌ملک ,بندر ماهشهر ,بهبهان ,خرمشهر ,دزفول ,دشت آزادگان ,رامشیر ,رامهرمز ,شادگان ,شوش ,شوشتر ,گتوند ,لالی ,مسجد سلیمان,هندیجان ">خوزستان</option>
            <option value="  ,ابهر ,ایجرود ,خدابنده ,خرمدره ,زنجان ,طارم ,ماه‌نشان">زنجان</option>
            <option value="  ,دامغان ,سمنان ,شاهرود ,گرمسار ,مهدی‌شهر">سمنان</option>
            <option value="  ,ایرانشهر ,چابهار ,خاش ,دلگان ,زابل ,زاهدان ,زهک ,سراوان ,سرباز ,کنارک ,نیک‌شهر">سیستان و بلوچستان</option>
            <option value="  ,آباده ,ارسنجان ,استهبان ,اقلید ,بوانات ,پاسارگاد ,جهرم ,خرم‌بید ,خنج ,داراب ,زرین‌دشت ,سپیدان ,شیراز ,فراشبند ,فسا ,فیروزآباد ,قیر و کارزین ,کازرون ,لارستان ,لامِرد ,مرودشت ,ممسنی ,مهر ,نی‌ریز">فارس</option>
            <option value="  ,آبیک ,البرز ,بوئین‌زهرا ,تاکستان ,قزوین">قزوین</option>
            <option value="  ,قم">قم</option>
            <option value="  ,بانه ,بیجار ,دیواندره ,سروآباد ,سقز ,سنندج ,قروه ,کامیاران ,مریوان">کردستان</option>
            <option value="  ,بافت ,بردسیر ,بم ,جیرفت ,راور ,رفسنجان ,رودبار جنوب ,زرند ,سیرجان ,شهر بابک ,عنبرآباد ,قلعه گنج ,کرمان ,کوهبنان ,کهنوج ,منوجان">کرمان</option>
            <option value="  ,اسلام‌آباد غرب ,پاوه ,ثلاث باباجانی ,جوانرود ,دالاهو ,روانسر ,سرپل ذهاب ,سنقر ,صحنه ,قصر شیرین ,کرمانشاه ,کنگاور ,گیلان غرب ,هرسین">کرمانشاه</option>
            <option value="  ,بویراحمد ,بهمئی ,دنا ,کهگیلویه ,گچساران">کهگیلویه و بویراحمد</option>
            <option value="  ,آزادشهر ,آق‌قلا ,بندر گز ,ترکمن ,رامیان ,علی‌آباد ,کردکوی ,کلاله ,گرگان ,گنبد کاووس ,مراوه‌تپه ,مینودشت">گلستان</option>
            <option value="  ,آستارا ,آستانه اشرفیه ,اَملَش ,بندر انزلی ,رشت ,رضوانشهر ,رودبار ,رودسر ,سیاهکل ,شَفت ,صومعه‌سرا ,طوالش ,فومَن ,لاهیجان ,لنگرود ,ماسال">گیلان</option>
            <option value="  ,بیرانشهر ,ازنا ,الیگودرز ,بروجرد ,پل‌دختر ,خرم‌آباد ,دورود ,دلفان ,سلسله ,کوهدشت">لرستان</option>
            <option value="  ,آمل ,بابل ,بابلسر ,بهشهر ,تنکابن ,جویبار ,چالوس ,رامسر ,ساری ,سوادکوه ,قائم‌شهر ,گلوگاه ,محمودآباد ,نکا ,نور ,نوشهر">مازندران</option>
            <option value="  ,آشتیان ,اراک ,تفرش ,خمین ,دلیجان ,زرندیه ,ساوه ,شازند ,کمیجان ,محلات">مرکزی</option>
            <option value="  ,ابوموسی ,بستک ,بندر عباس ,بندر لنگه ,جاسک ,حاجی‌آباد ,شهرستان خمیر ,رودان  ,قشم ,گاوبندی ,میناب">هرمزگان</option>
            <option value="  ,اسدآباد ,بهار ,تویسرکان ,رزن ,کبودرآهنگ ,ملایر ,نهاوند ,همدان">همدان</option>
            <option value="  ,ابرکوه ,اردکان ,بافق ,تفت ,خاتم ,صدوق ,طبس ,مهریز ,مِیبُد ,یزد">یزد</option>
        </select>   
        
     <select id="EditCity" name="EditCity" class="form-select" onchange="EditSwapVale1()">
     </select>

I want to add the object inside the arm but instead it floating on the arm how do i apply that logic in my code please help me out…i am not able to add that object example like a braclet

I’d need to select a date (on a calendar) via Javascript/Jquery. The user can only choose a date between 50 and 80 years before today date. How can I do that?
Please help

I have communication between background and content scripts

Basically it looks like:

// background script fragment

const url = 'https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf';
(async () => {
  const tab = await chrome.tabs.create({ url });

  await new Promise(resolve => setTimeout(resolve, 2000));

  if (tab.id !== undefined) {
    const response = await chrome.tabs.sendMessage(tab.id, { action: 'EXTRACT_TAB_DATA', url });
    // case "extract text from PDF" -- undefined
    // case "set text by copy and paste" -- object with key result == "Dummy PDF file copy pasted content"
    console.log(response);
  }
})();

// case "extract text from PDF" content script fragment

import * as pdfjsLib from 'pdfjs-dist';
pdfjsLib.GlobalWorkerOptions.workerSrc = chrome.runtime.getURL('pdf.worker.js');


chrome.runtime.onMessage.addListener(async (message, sender, sendResponse) => {
  if (message.action === 'EXTRACT_TAB_DATA') {
    const pdfData = await fetch(message.url).then(res => res.arrayBuffer());
    const pdf = await pdfjsLib.getDocument({ data: pdfData }).promise;

    let text = '';
    for (let i = 1; i <= pdf.numPages; i++) {
      const page = await pdf.getPage(i);
      const content = await page.getTextContent();
      text += content.items.map((item: any) => item.str).join(' ') + 'n';
    }

    console.log(text); // here everything as expected: text is in console

    sendResponse({ result: text });

    return true;
  }

  return true;
});

// case "set text by copy and paste" content script fragment

import * as pdfjsLib from 'pdfjs-dist';
pdfjsLib.GlobalWorkerOptions.workerSrc = chrome.runtime.getURL('pdf.worker.js');


chrome.runtime.onMessage.addListener(async (message, sender, sendResponse) => {
  if (message.action === 'EXTRACT_TAB_DATA') {
    const text = 'Dummy PDF file copy pasted content';
    sendResponse({ result: text });

    return true;
  }

  return true;
});

used version of pdfjs-dist is ^2.16.105. basically it doesn’t matter the version. matter result of extracting and sending back to background script

my manifest file fragment

{
  "manifest_version": 3,
  "action": {
    "default_title": "Open sidebar",
    "default_icon": "img/logo-48.png"
  },
  "options_page": "options.html",
  "background": {
    "service_worker": "service-worker-loader.js",
    "type": "module"
  },
  "content_scripts": [
    {
      "matches": [
        "http://*/*",
        "https://*/*"
      ],
      "js": [
        "src/contentScript/index.ts-loader.js"
      ]
    }
  ],
  "web_accessible_resources": [
    {
      "resources": [
        "img/logo-16.png",
        "img/logo-32.png",
        "img/logo-48.png",
        "img/logo-128.png"
      ],
      "matches": []
    },
    {
      "matches": [
        "<all_urls>"
      ],
      "resources": [
        "**/*",
        "*"
      ],
      "use_dynamic_url": false
    }
  ],
  "permissions": [
    "sidePanel",
    "storage",
    "identity",
    "activeTab",
    "tabs",
    "scripting"
  ],
  "host_permissions": [
    "<all_urls>"
  ]
}

what is wrong with sending back message from content to background script in case extract from pdf?

I add my nodes in elements and then I want edges to be generated for each node according to certain node attributes (node ID for target, and a new property “origin” for source).

I’m having trouble getting that origin value into the new edge data — trying to use ele.data().

var cy = cytoscape({
  container: document.getElementById('cy'),
  layout: {
    name: 'cose'
  },
  style: [
    {
      selector: 'node',
      style: {
        'label': 'data(label)',
        'color': '#fff'
      }
    },
    {
      selector: 'edge',
      style: {
        'line-color': '#fff'
      }
    }
  ],
   elements: [
    { data: { id: 'n101', label: 'Node 1', origin: 'n104' } }, // Maybe I'm not creating the origin value correctly? No I have to do something else?
    { data: { id: 'n102', label: 'Node 2', origin: 'n101' } },
    { data: { id: 'n103', label: 'Node 3', origin: 'n102' } },
    { data: { id: 'n104', label: 'Node 4', origin: 'n103' } }
  ]
});

cy.nodes().forEach(function( ele ){
    cy.add({
      group: 'edges',
      data: { source: ele.data(origin), target: ele.id() }
      /*  ele.id() works to set the target, but
          I don't know if I'm using ele.data()
          correctly. If I replace it with something
          like 'n101', the edges get made, so I
          assume this is where my issue is? */
    })
});

I have a long experience with virtual tables, my latest implementation in Vue. It’s complex, the table rows have child components, etc. So a virtual table would work for years without seeing re-rendering of the updated rows, for example the new rows at the top or the bottom in Chrome. In Firefox the re-rendering was always visible. In some latest build of Chrome the re-rendering became visible in Chrome too which is greatly ruins UX. No code changes were introduced (in fact, the old version of the virtual grid started behave the same).

So my question: is anybody aware of some recent changes in Chrome’s rendering (especially on a scroll event).

I’ve tried to recreate a vue virtual table in the playground. You could see a heavy scroll listener, so the scrolling is heavy/lagging, BUT no flickering. Unfortunately the very first version of my Vue virtual table flickers so there’s no way to catch with git bisect when it started flickering. So maybe some Chrome hack is available, or at least to understand why Chrome started flickering on scrolling.

Hello Everyone! I have problem with telegram browser. Firstly web site open but 4,5 second after output error (Oops.. Failed to load website)

How to find solution of problem, I cannot open browser console so I’m having trouble finding the error.How can I get rid of the error or how can I find the problem?

I’m experiencing unexpected behavior click and drag events between a div and the body in JavaScript.

Here’s the behavior I’m seeing when I click and drag:

• Start in the floating div, release in body → logs Body Event
• Start and release in floating → logs Floating Event
• Start in body, release in floating → logs Body Event
• Start and release in body → logs Body Event

The surprising case is the third one: Why doesn’t the click event fire on the floating div when I release the mouse over it, even though the mouseup happens on it?

Here’s the setup:

document.getElementById('floating').addEventListener('click', (e) => {
  e.stopPropagation();
  console.log('Floating Event');
});

document.body.addEventListener('click', () => {
  console.log('Body Event');
});

body, html {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
}

.floating-object {
  position: absolute;
  top: 60px;
  left: 200px;
  width: 150px;
  height: 150px;
  background: orange;
  border-radius: 50%;
  z-index: 1002;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}

<div class="floating-object" id="floating"></div>

Error I’m facing :

My server file :

const express = require('express');
const cors = require('cors');

const todoRoutes = require('./routes/todoRoutes');

const app = express();
// To remove  res.setHeader('X-Powered-By', 'Express'); error :
app.disable('x-powered-by');

//midlleware 
app.use(cors());
app.use(express.json()); 

// Routers :
app.use('/api/todo', todoRoutes); 


app.listen(5000);  

Router file :

const express = require('express');

const router = express.Router();

const todoController = require('../controller/todoController'); 

router.route('/').post(todoController.addTodo).get(todoController.getTodo);
router.route('/:id').get(todoController.getTodoByID).put(todoController.updateTodo).delete( todoController.deleteTodo);

Controller file :

const pool = require("../db");

const addTodo = async (req, res, next) => {
    try {
        const { description } = req.body;
        const newTodo = await pool.query(
          "INSERT INTO todo (description) VALUES($1) RETURNING *",
          [description]
        );
    
        res.json(newTodo.rows[0]);
      } catch (err) {
        console.error(err.message);
      }
};


module.exports = { addTodo };

I’m unable to understand what’s wrong?

I have a version (eg. diamond-pearl) and want to filter encounters. The encounters return data like diamond. I can do a simple string check (which I currently do), but this is not ideal because it isn’t perfect. I could hard code each one but this defeats the purpose of an API and requires updating any time new data is entered, which is somthing I 100% want to avoid.

Current implementation (svelte 5):

let filteredEncounters = $derived.by(() => {
        console.log(encounters);
        if (version === 'all') return encounters;

        return encounters
            .map((e) => {
                // TODO: Stupid string match: checks if `version` (eg. `diamond-pearl`) includes `version.name` (eg. `diamond`)
                // In the future, we need to map games and versions which are different
                const matchingVersions = e.version_details.filter((v) => version.includes(v.version.name));

                if (matchingVersions.length > 0) {
                    return {
                        ...e,
                        version_details: matchingVersions
                    };
                }

                return null;
            })
            .filter(Boolean);
    });

I’m trying to set up the same ESLint configuration in my new React 19 + Vite app using the modern eslint.config.js format. However, it’s not working — the linter doesn’t show any errors or warnings in the editor.
New eslint.config.js

import pluginReact from "eslint-plugin-react";
import { defineConfig } from "eslint/config";

import reactHooks from "eslint-plugin-react-hooks";
import reactRefresh from "eslint-plugin-react-refresh";
import prettier from "eslint-plugin-prettier";
import importPlugin from "eslint-plugin-import";
import react from "eslint-plugin-react";
import jsxA11y from "eslint-plugin-jsx-a11y";

export default defineConfig([
  { ignores: ["dist"] },
  {
    files: ["**/*.{js,mjs,cjs,jsx}"],
    languageOptions: {
      ecmaVersion: 2020,
      globals: globals.browser,
      parserOptions: {
        ecmaVersion: "latest",
        ecmaFeatures: { jsx: true },
        sourceType: "module",
      },
    },
    plugins: {
      "react-hooks": reactHooks,
      "react-refresh": reactRefresh,
      prettier,
      import: importPlugin,
      react,
      "jsx-a11y": jsxA11y,
    },
    rules: {
      ...js.configs.recommended.rules,
      ...reactHooks.configs.recommended.rules,
      // "no-unused-vars": ["error", { varsIgnorePattern: "^[A-Z_]" }],
      // "no-undef": ["error", { globals: { process: true } }],
      // Vite React specific
      "react-refresh/only-export-components": [
        "warn",
        { allowConstantExport: true },
      ],

      // Your custom rules from old config
      "prettier/prettier": "off",
      "no-nested-ternary": "off",
      "no-underscore-dangle": "off",
      "default-param-last": "off",
      "prefer-arrow-callback": "error",
      camelcase: ["error", { properties: "never", ignoreDestructuring: true }],
      "no-else-return": ["error", { allowElseIf: true }],
      "no-param-reassign": ["error", { props: false }],

      // Import rules
      "import/no-extraneous-dependencies": [
        "error",
        {
          devDependencies: false,
          optionalDependencies: false,
          peerDependencies: false,
        },
      ],
      "import/order": [
        "error",
        {
          pathGroups: [
            {
              pattern: "react",
              group: "external",
              position: "before",
            },
          ],
          pathGroupsExcludedImportTypes: ["builtin"],
        },
      ],
      "import/no-unused-modules": ["error", { unusedExports: true }],

      // React rules
      "react/require-default-props": "off",
      "react/jsx-no-undef": ["error", { allowGlobals: true }],
      "react/jsx-uses-vars": "error",

      // Best Practices
      eqeqeq: "error",
      "no-invalid-this": "error",
      "no-return-assign": "error",
      "no-unused-expressions": ["error", { allowTernary: true }],
      "no-useless-concat": "error",
      "no-useless-return": "error",
      "no-use-before-define": "error",
      "no-duplicate-imports": "error",
      "no-plusplus": ["error", { allowForLoopAfterthoughts: true }],

      // Variable and import rules
      "no-undef": "error",
      "no-unused-vars": [
        "error",
        {
          vars: "all",
          args: "after-used",
          ignoreRestSiblings: true,
          varsIgnorePattern: "^[A-Z_]", // Keep the pattern from new config
        },
      ],
    },
    settings: {
      react: {
        version: "detect",
      },
    },
  },
  pluginReact.configs.recommended,
]);

This is the ESLint config I used successfully in my older CRA app (.eslintrc.js):

  env: {
    browser: true,
    es2021: true,
    node: true,
  },
  extends: ["prettier"],

  plugins: ["prettier", "import", "react", "react-hooks", "jsx-a11y"],
  parserOptions: {
    ecmaFeatures: {
      jsx: true,
    },
    ecmaVersion: 12,
    sourceType: "module",
  },
  rules: {
    "prettier/prettier": "off",
    "no-nested-ternary": "off",
    "react/require-default-props": "off",
    "no-underscore-dangle": ["off"],
    "default-param-last": "off",
    "prefer-arrow-callback": "error",
    camelcase: ["error", { properties: "never", ignoreDestructuring: true }],
    "no-else-return": ["error", { allowElseIf: true }],
    "no-param-reassign": ["error", { props: false }],
    // Best Practices
    "import/no-extraneous-dependencies": [
      "error",
      {
        devDependencies: false,
        optionalDependencies: false,
        peerDependencies: false,
      },
    ],
    eqeqeq: "error",
    "no-invalid-this": "error",
    "no-return-assign": "error",
    "no-unused-expressions": ["error", { allowTernary: true }],
    "no-useless-concat": "error",
    "no-useless-return": "error",
    "no-use-before-define": "error",
    "no-duplicate-imports": "error",
    "no-plusplus": ["error", { allowForLoopAfterthoughts: true }],
    "import/order": [
      "error",
      {
        pathGroups: [
          {
            pattern: "react",
            group: "external",
            position: "before",
          },
        ],
        pathGroupsExcludedImportTypes: ["builtin"],
      },
    ],
    // Ensure components are imported if used
    "react/jsx-no-undef": ["error", { allowGlobals: true }],
    // Ensure all variables are declared before use
    "no-undef": "error",
    // Ensure there are no unused variables
    "no-unused-vars": ["error", { vars: "all", args: "after-used", ignoreRestSiblings: true }],
    // Ensure there are no unused imports
    "import/no-unused-modules": ["error", { unusedExports: true }],
    // Mark variables used in JSX as used
    "react/jsx-uses-vars": "error",
  },
  settings: {
    react: {
      version: "detect",
    },
  },
};

I did try npm run lint but I get this
Oops! Something went wrong! 🙁

ESLint: 9.28.0

ESLint couldn’t find a configuration file. To set up a configuration file for this project, please run:

`npm init @eslint/config@latest`

And if I run this command, it resets full eslint.config.js file

But I’m not sure how to properly convert or apply it to the new flat config (eslint.config.js).
Any ideas on how to correctly set it up so ESLint works in the new environment?

The following is part of a script to dynamically add lines to a form:

                '<div class="col-15">'+
                    '<label <?php echo $participant_name_'+ x +'_err;?>>Name*</label>'+
                '</div>'+

The middle line causes the error. If I remove the line, the page loads normal.

Help appreciated, thanks in advance.

Richard

I’m trying to get a user’s name and convert it to uppercase. Here’s my code

function getUserName(user) {
    return user.name.toUpperCase();
}

const user = null;

console.log(getUserName(user));

But I’m getting this error:

TypeError: Cannot read properties of null (reading 'name')

I understand this happens because user is null.
What is the best way to write this function so that it doesn’t throw an error when user is null, and instead returns a fallback value like 'Unknown'?

I’m using the code below to paste a string into a DOM element (in this case a DIV element in a React website).

The code works but if the element has already some text, the code will paste my string AFTER the current text and what i want is , the field ends up ONLY with my text. How can i clear the field content before pasting ?

I know it would be better to use .value or .innerText but there are some limitations in the specific site i’m dealing avoiding me to use a simpler approach (it’s a React site), so that’s why i’m using the clipboard method instead, it’s the only one that works.

let el = document.getElementsByClassName('xzsf02u x1a2a7pz x1n2onr6 x14wi4xw x9f619 x1lliihq x5yr21d xh8yej3 notranslate')[0];
const dataTransfer = new DataTransfer();
dataTransfer.setData('text','testing one two three');
const event = new ClipboardEvent('paste', {clipboardData: dataTransfer,bubbles: true});
el.focus();
el.dispatchEvent(event);
el.focus();

Like days now when I try to start my bot from the host it gets this error(photo)enter image description here but t works locally. Also I’m waiting like a week to answer me and try to find a solution do I’ma sling here

I tried to see if it was token problem and also checked shards but it is not there the problem