TypeScript dom-globals.document.body類代碼示例

const openLink = function (target) {
  const link = document.createElement('a');
  link.target = '_blank';
  link.href = target.href;
  link.rel = 'noreferrer noopener';

  const nuEvt = document.createEvent('MouseEvents');
  nuEvt.initMouseEvent('click', true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);

  document.body.appendChild(link);
  link.dispatchEvent(nuEvt);
  document.body.removeChild(link);
};

 const sAddTestDiv = Step.sync(function () {
   const div = document.createElement('div');
   div.innerHTML = 'xxx';
   div.contentEditable = 'true';
   div.id = testDivId;
   document.body.appendChild(div);
 });

  const setup = function (success, failure) {
    const div = document.createElement('div');

    div.innerHTML = (
      '<div id="lists">' +
      '<ul><li>before</li></ul>' +
      '<ul id="inline"><li>x</li></ul>' +
      '<ul><li>after</li></ul>' +
      '</div>'
    );

    document.body.appendChild(div);

    EditorManager.init({
      selector: '#inline',
      inline: true,
      add_unload_trigger: false,
      skin: false,
      plugins: 'lists',
      disable_nodechange: true,
      init_instance_callback (editor) {
        Pipeline.async({}, Log.steps('TBA', 'Lists: Backspace delete inline tests', suite.toSteps(editor)), function () {
          teardown(editor, div);
          success();
        }, failure);
      },
      valid_styles: {
        '*': 'color,font-size,font-family,background-color,font-weight,font-style,text-decoration,float,' +
        'margin,margin-top,margin-right,margin-bottom,margin-left,display,position,top,left,list-style-type'
      }
    });
  };

const getImageSize = function (url, callback) {
  const img = document.createElement('img');

  function done(dimensions) {
    if (img.parentNode) {
      img.parentNode.removeChild(img);
    }

    callback(dimensions);
  }

  img.onload = function () {
    const width = parseIntAndGetMax(img.width, img.clientWidth);
    const height = parseIntAndGetMax(img.height, img.clientHeight);
    const dimensions = {width, height};
    done(Result.value(dimensions));
  };

  img.onerror = function () {
    done(Result.error(undefined));
  };

  const style = img.style;
  style.visibility = 'hidden';
  style.position = 'fixed';
  style.bottom = style.left = '0px';
  style.width = style.height = 'auto';

  document.body.appendChild(img);
  img.src = url;
};

export default function () {

  const button = document.createElement('button');
  button.innerHTML = 'Get all annotations';
  button.addEventListener('click', () => {
    // tslint:disable no-console
    console.log('annotations', tinymce.activeEditor.annotator.getAll('alpha'));
    // tslint:enable no-console
  });
  document.body.appendChild(button);

  tinymce.init({
    skin_url: '../../../../js/tinymce/skins/ui/oxide',
    selector: 'textarea.tinymce',
    toolbar: 'annotate-alpha',
    plugins: [ ],

    content_style: '.mce-annotation { background-color: darkgreen; color: white; }',

    setup: (editor: Editor) => {
      editor.ui.registry.addButton('annotate-alpha', {
        text: 'Annotate',
        onAction() {
          const comment = prompt('Comment with?');
          editor.annotator.annotate('alpha', {
            comment
          });
          editor.focus();
        },
        onSetup (btnApi) {
          editor.annotator.annotationChanged('alpha', (state, name, obj) => {
            btnApi.setDisabled(state);
          });
          return () => {};
        }
      });

      editor.on('init', () => {
        editor.annotator.register('alpha', {
          persistent: true,
          decorate: (uid, data) => {
            return {
              attributes: {
                'data-mce-comment': data.comment ? data.comment : '',
                'data-mce-author': data.author ? data.author : 'anonymous'
              }
            };
          }
        });
      });
    },

    menubar: false
  });
}

  const assertSpecificFontProp = function (fontProp, html, path, expected) {
    const div = document.createElement('div');
    const fontGetProp = fontProp === 'fontSize' ? FontInfo.getFontSize : FontInfo.getFontFamily;

    document.body.appendChild(div);
    div.innerHTML = html;
    const elm = Hierarchy.follow(Element.fromDom(div), path).getOrDie('oh no! ' + path.toString() + '  path was bad');
    const actual = fontGetProp(div, elm.dom());
    LegacyUnit.equal(
      actual,
      expected,
      'Doesn\'t match the expected specific element style'
    );
    div.parentNode.removeChild(div);
  };

  suite.test('hasFocus', function (editor) {
    editor.focus();
    LegacyUnit.equal(editor.hasFocus(), true);

    const input = document.createElement('input');
    document.body.appendChild(input);

    input.focus();
    LegacyUnit.equal(editor.hasFocus(), false);

    editor.focus();
    LegacyUnit.equal(editor.hasFocus(), true);

    input.parentNode.removeChild(input);
  });

  suite.asyncTest('getFontFamily should always return string even if display: none (firefox specific bug)', function (_, done) {
    const iframe = document.createElement('iframe');
    iframe.style.display = 'none';
    document.body.appendChild(iframe);

    iframe.addEventListener('load', function () {
      const fontFamily = FontInfo.getFontFamily(iframe.contentDocument.body, iframe.contentDocument.body.firstChild);
      LegacyUnit.equal(typeof fontFamily, 'string', 'Should always be a string');
      iframe.parentNode.removeChild(iframe);

      done();
    }, false);

    iframe.contentDocument.open();
    iframe.contentDocument.write('<html><body><p>a</p></body></html>');
    iframe.contentDocument.close();
  });

  return new Promise(function (resolve) {
    let fileInput;

    fileInput = document.createElement('input');
    fileInput.type = 'file';
    fileInput.style.position = 'fixed';
    fileInput.style.left = 0;
    fileInput.style.top = 0;
    fileInput.style.opacity = 0.001;
    document.body.appendChild(fileInput);

    fileInput.onchange = function (e) {
      resolve(Array.prototype.slice.call(e.target.files));
    };

    fileInput.click();
    fileInput.parentNode.removeChild(fileInput);
  });

      Step.async(function (next, die) {
        const iframe = document.createElement('iframe');
        iframe.style.display = 'none';
        document.body.appendChild(iframe);

        iframe.addEventListener('load', function () {
          try {
            const measured = BoxUtils.measureBox(iframe.contentDocument.body.firstChild, 'border');
            Assertions.assertEq('should return 0', 0, measured.top);
            iframe.parentNode.removeChild(iframe);
            next();
          } catch (e) {
            die('Should not throw error, ' + e.message);
          }
        }, false);

        iframe.contentDocument.open();
        iframe.contentDocument.write('<html><body><div>a</div></body></html>');
        iframe.contentDocument.close();
      })