Как получить результат из двух функций и передать ее в третью на промисах?

Question

[Leo Mavrin]

У меня есть функция и событие MutationObserver. MutationObserver срабатывает, когда DOM меняется.
И есть функция которая работает при клике.
Проблема в том, чтобы дождаться результата выполнения функции и дождаться MutationObserver. Если функция и событие сработали и все вернули true, то нужно вызвать третью функцию с аргументом, пришедшею из первой функции.
MutationObserver срабатывает, когда новый DOM создан и готов для работы с ним. Как, это все можно реализовать на промисах? Гуглил, видел примеры, но не очень понимаю, как, это должно быть реализовано в моем случаи. Первая функция вызывается из одного места, вторая - событие, третья должна быть вызвана в случаии успеха первых двух

Пример:

function f1(){
  if(true){
    return true;
  }
}

let observer = new MutationObserver((mutations) => {
 ....
});

function f3(arg){
 ...
}

Comments

[Stalker_RED]

Клик и срабатывание MutationObserver'а как-то связаны или нет?
Может ли быть такое, что кликов было три, например, а MutationObserver сработал только один раз?
Или наоборот, один клик, и несколько срабатываний MutationObserver?

Что вы вообще пытаетесь сделать?

[Leo Mavrin]

Stalker_RED, клик только один может быть, как и срабатывание MutationObserver может произойти лишь единожды.
По клику на кнопку, меняется DOM, MutationObserver срабатывает.

Я пишу библиотку для создания popup окон.

Один клик = одно срабатывание.
Более одного клика быть не может

Answer 1

[Anton fon Faust]

MutationObserver вам тут нафиг не нужен.
Делайте по клику коллбек, который вызовет то, что вам нужно (ajax запросы, вычисления и все что угодно) и внесет все изменения в DOM. Сомневаюсь, что вставка DOM у вас займет больше 0,3 секунды. Так что можете смело забивать на mutationObserver и синхронно показывать ваше окно после ресолва промиса после клика.

Comments

[Leo Mavrin]

Мне важно знать, когда будут изменения в DOM'е. Т.к я вешаю событие после этого

[Anton fon Faust]

Leo Mavrin, тут, похоже, "слышал звон, да не знаю где он")))
Вам нужно не c mutationObserve заморачиваться, а разобраться что такое всплытие событий https://learn.javascript.ru/event-bubbling
и делегирование событий:
https://learn.javascript.ru/event-delegation

после этого поймете что за паттерн behavior:
https://learn.javascript.ru/behavior

Вешаете на родительский блок (в который что-то вставляете) обработчик события - и вам уже не важно, на каком элементе оно произойдет, так как оно всеравно всплывает и прекрасно обрабатывается.

[Leo Mavrin]

Anton fon Faust, вы не поняли)
У меня при клики, меняется DOM, создается новое окно, в этом окне может быть кнопка, на которую нужно повесить событие. Мне надо быть увереным в том, что новый DOM создан и с ним можно работать, чтобы было куда событие вешать. Про всплытие и делегирование, я знаю) Оно используется для того, чтобы опредлить где кликнули, и что надо открыть.

Внутри окна может быть не одна кнопка, а несколько и на каждую нужно повесить свое событие, но делать это, пока нет DOM'a, нельзя

[Anton fon Faust]

Leo Mavrin, В общем, не разобрались, и полезли в какие-то дебри.
Тяжело вам будет c js.

jsfiddle.net/anton4ept/6ejamy29

По клику добавляются кнопки (меняется DOM). Меняется DOM с неизвестным для меня интервалом (до 5 секунд), но... о чудо. клики обрабатываются)))

Answer 2

[rampagerushtc]

Что-то типа того?

const returnTrue = (arg) => {
  setTimeout(console.log(`First function: - I\'m done. The argument is ${arg}`), 2000);
  return [true, arg];
};


  
const mutationObserver = new Promise((resolve, reject) => {
	setTimeout(() => {
  		resolve('First promise done');
  }, 1500);
 });

const anotherPromise = args => {
	return new Promise((resolve, reject) =>
					setTimeout(()=> {
						resolve(`Second promise done with ${args}`);
					}, 1500));
};
 
mutationObserver
.then(result => {
	const arr = returnTrue('some args')
	if (arr[0]) {
		console.log(result );
		return anotherPromise(arr[1]);
  }
 })
.then(result => {
	console.log(result);
});

Comments

[Leo Mavrin]

Что-то на подобии)