ボタンを追加する場所のelementを知りたい

[scy]

画像の赤丸または青丸部分にボタンを設置したいのですが
この部分にあたるelementがわかりません。
kintone.app.getHeaderMenuSpaceElement() のような部分になります。
F12で調べたのですがclassしか表示がなく、ドキュメントを見たのですが該当する部分がありませんでした。
調べ方、またはドキュメントがどこかにありましたら教えていただけないでしょうか。
よろしくお願いいたします。

[pomo]

document.querySelectorあたりでclass掴んでボタン追加するしかないです。
ただ、class名が変更となった場合保証されないのである日突然ボタンがなくなる可能性はゼロです。

ですので、できたらintone.app.record.getHeaderMenuSpaceElement等使って所定の位置に設置しておいた方が安全ではあると思います。
（とはいえ私も一部逃げ道与えながらカスタムしてます）

[scy]

ありがとうございます。

ちなみに宛先指定となっている部分のクラスがあったので下記を実行したのですがNode list でデータがありませんでした。この場合～Elementにあたるものがないということでしょうか。

document.querySelectorAll(“goog-inline-block goog-toolbar-button ocean-ui-editor-toolbar-mention”)

また、下記でヘッダー部スペースにボタンを追加しようとしたのですがボタンが表示されませんでした。どこか記載が間違っているのでしょうか。

(() => {
   'use strict';

   kintone.events.on([
      'app.record.create.show',
      'app.record.edit.show'
  ], (event) => {
    
      if (document.getElementById('test_button') !== null) {
      return;
    }
    
     // ボタン
     const forwarder_button = document.createElement('button');
     test_button.id = 'test_button';
     test_button.innerText = 'test';
 
     // メニューの右側の空白部分ボタンを設置
     kintone.app.record.getHeaderMenuSpaceElement().appendChild(test_button);
   });
 })();

[pomo]

クラスなのでドットで連結してください。

document.querySelectorAll(“.goog-inline-block.goog-toolbar-button.ocean-ui-editor-toolbar-mention”)

コードの方はtest_buttonがそもそも定義(fowarderで宣言してる)されてないんでそこかなぁと

[scy]

失礼いたしました。
下記に直したところボタン設置できました。
ただ、スクロールするとボタンが隠れてしまうので
追加や編集ボタンのように下にスクロールしてもボタンが隠れないようにしたいのですがここに設置は可能でしょうか。
調べたところ gaia-argoui-app-toolbar-menu のクラスに設置すれば良さそうなのですが
kintone.app.record.getToolbarMenuElement().appendChild(test_button);
のようにしたらできるかと思いましたが駄目でした。
なお、教えていただいた
document.querySelectorAll(“.goog-inline-block.goog-toolbar-button.ocean-ui-editor-toolbar-mention”)
も実行して調べたのですがNode list でした。

(() => {
   'use strict';

   kintone.events.on([
      'app.record.create.show',
      'app.record.edit.show'
  ], (event) => {
    
      if (document.getElementById('test_button') !== null) {
      return;
    }
    
     // ボタン
     const test_button= document.createElement('button');
     test_button.id = 'test_button';
     test_button.innerText = 'test';
 
     // メニューの右側の空白部分ボタンを設置
     kintone.app.record.getHeaderMenuSpaceElement().appendChild(test_button);
   });
 })();

[pomo]

document.querySelector(“.goog-toolbar.goog-toolbar-horizontal”)あたりを掴んであげて、スタイルinlineのもの入れてあげれば良いのかなと。

[scy]

ありがとうございます！できました。
後はボタンを押したらフィールドコードが入ればいいのですが
下記を
document.querySelector(“.goog-toolbar.goog-toolbar-horizontal”).appendChild(test_button);
});

の下に追加してもダメでした。
なぜかボタンを押すだけでは何も起きないのですが、何かコメントを入れてtestボタンを押すとコメントが送れてしまいます。

   // イベントハンドラーの設定
test_button.addEventListener('click', function() {
  // テキストボックスへの値の入力
  const comment = document.querySelector("ocean-ui-editor-field editable ocean-editor-seamless");
  comment.value += record.testフィールドコード.value;
});