Я получаю «Uncaught ReferenceError: типпи не определен»

Я написал этот код

require 'watir'
b = Watir::Browser.new
b.window.maximize

  b.goto 'URL'
  # var headElement = document.getElementsByTagName(\"head\")[0];
sleep 3
b.execute_script("
const popperStylesheet = document.createElement('link');
popperStylesheet.rel = 'stylesheet';
popperStylesheet.href = 'https://unpkg.com/@popperjs/core@2.11.6/dist/umd/popper.css';

const tippyStylesheet = document.createElement('link');
tippyStylesheet.rel = 'stylesheet';
tippyStylesheet.href = 'https://unpkg.com/tippy.js@6.3.3/dist/tippy.css';

const popperScript = document.createElement('script');
popperScript.src = 'https://unpkg.com/@popperjs/core@2.11.6/dist/umd/popper.js';

const tippyScript = document.createElement('script');
tippyScript.src = 'https://unpkg.com/tippy.js@6.3.3/dist/tippy.umd.js';
tippyScript.onload = function() {
  const customStyles = document.createElement('style');
  customStyles.innerHTML = `
    .custom-theme {
      background-color: #1c00d4;
      color: #ffffff;
      border-radius: 10px;
    }

    .custom-theme .tippy-arrow {
      color: #0012d4;
    }

    .tippy-box {
      background-color: Green;
    }

    .tippy-content {
      font-size: 20px;
    }
  `;

  var inputElement = document.getElementById('UserName');

  if (inputElement) {
    console.info('Selected file:');
    inputElement.addEventListener('focus', function() {
      inputElement._tippy.show();
    });

    tippy(inputElement, {
      content: 'Here you enter the first name, firstname should contain no numbers',
      theme: 'custom-theme',
      placement: 'right',
      arrow: true,
      duration: 300,
      delay: [500, 0],
      maxWidth: 200
    });
  }

  var headElement = document.getElementsByTagName(\"head\")[0];
  headElement.appendChild(popperStylesheet);
  headElement.appendChild(tippyStylesheet);
  headElement.appendChild(tippyScript);
  headElement.appendChild(popperScript);
  headElement.appendChild(customStyles);
};

var headElement = document.getElementsByTagName(\"head\")[0];
headElement.appendChild(popperStylesheet);
headElement.appendChild(tippyStylesheet);
headElement.appendChild(tippyScript);
headElement.appendChild(popperScript);
")

У меня нет способа проверить, определен ли этот типичный метод, он часто выдает эту ошибку

Uncaught ReferenceError: tippy is not defined
    at tippyScript.onload (eval at executeScript (login.do:476:16), <anonymous>:47:5)

Можно ли как-нибудь проверить, правильно ли определен этот метод, прежде чем вызывать его? Я даже использовал сон 3, как показано выше, прежде чем мы его выполним, но все же я часто получаю эту ошибку.

Руководство для начинающих по веб-разработке на React.js
Руководство для начинающих по веб-разработке на React.js
Веб-разработка - это захватывающая и постоянно меняющаяся область, которая постоянно развивается благодаря новым технологиям и тенденциям. Одним из...
Калькулятор CGPA 12 для семестра
Калькулятор CGPA 12 для семестра
Чтобы запустить этот код и рассчитать CGPA, необходимо сохранить код как HTML-файл, а затем открыть его в веб-браузере. Для этого выполните следующие...
Как собрать/развернуть часть вашего приложения Angular
Как собрать/развернуть часть вашего приложения Angular
Вам когда-нибудь требовалось собрать/развернуть только часть вашего приложения Angular или, возможно, скрыть некоторые маршруты в определенных средах?
Оптимизация React Context шаг за шагом в 4 примерах
Оптимизация React Context шаг за шагом в 4 примерах
При использовании компонентов React в сочетании с Context вы можете оптимизировать рендеринг, обернув ваш компонент React в React.memo сразу после...
Интервьюер: Почему &apos;[] instanceof Object&apos; возвращает &quot;true&quot;?
Интервьюер: Почему '[] instanceof Object' возвращает "true"?
Все мы знаем, что [] instanceof Array возвращает true, но почему [] instanceof Object тоже возвращает true?
Абстрактное синтаксическое дерево (AST) и как оно работает с ReactJS
Абстрактное синтаксическое дерево (AST) и как оно работает с ReactJS
Абстрактное синтаксическое дерево (AST) - это древовидная структура данных, которая представляет структуру и иерархию исходного кода на языке...
0
0
52
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Функции в JS — это «объекты первого класса». Когда вы определяете function f() {}, вы просто создаете функцию (ненадолго анонимную) и сохраняете ее ссылку в переменной с именем f. Вы можете проверить существование f (и его тип и т. д.) так же, как и любую другую переменную.

Пример:

function f1() { console.info ("I am f1()!"); }
var f3 = f1;    // Both variables will reference the same actual function

console.info ("f1 is a " + typeof f1);
console.info ("f2 is a " + typeof f2);
console.info ("f3 is a " + typeof f3);

if (typeof f1 != "undefined") f1();
if (typeof f2 != "undefined") f2();
if (typeof f3 != "undefined") f3();

Выход:

f1 is a function
f2 is a undefined
f3 is a function
I am f1()!
I am f1()!

В Stack Overflow есть несколько хороших сообщений о том, как проверить существование и тип переменной (не только для функций), но они касаются некоторых тонкостей языка, которые могут быть слишком сложными для ваших реальных нужд.

Diego Ferruchelli 18.02.2023 21:18

Привет большое спасибо. Этот пост объясняет, как проверить, определена ли функция. Но моя проблема в том, что я должен определить функцию, несмотря ни на что. Если есть ошибка undefined, то я должен переопределить ее или дождаться определения метода, как мне это сделать?

Rajagopalan 19.02.2023 04:29

..... Ах да, именно это я и задал в вопросе. Но не могли бы вы помочь мне в том, как дождаться определения метода, чтобы не возникала ошибка неопределенного метода?

Rajagopalan 19.02.2023 04:53

Кажется, вам нужно определить свойство onload перед свойством src (в элементе, на который ссылается переменная tippyScript) (на всякий случай). Проверьте ответ на этот пост.

Diego Ferruchelli 19.02.2023 17:44

Я вижу, вы вызываете appendChild() со всеми свойствами уже на месте (порядок не должен иметь значения). Но я пытаюсь запустить ваш код и получаю Uncaught ReferenceError: tippy is not defined. Что-то не так с вашими путями к другим библиотекам, и это мешает загрузке typpy.

Diego Ferruchelli 19.02.2023 19:08

Другие вопросы по теме