皆さんはSalesforceで今日も長くて難解で楽しい数式書いてますか？私は今日も元気に楽しく数式を書いています。

もし同じ事をしようとしている人がいたら（いない事を祈る）簡単に出来るといいなと思ったので書きます。

前提条件

Datetime型（日付/時間データ型）の項目が既にある
30分とか45分とか60分とか追加したい分数の選択リストがある
分数を元の項目に加算した項目を作りたい
（大変だから）日付をまたいだ加算はしない

という場面の解決法です。

わかりづらいので具体的な例

これから『終了時間』という項目を足したいこんなオブジェクトがあるとします。

f:id:noblejasper:20200327230930p:plain — 項目を作る前の状態はこんな状態

参照名はこんな感じ

開始時間 = StartDatetime__c
必要時間 = RequireMinutes__c

これを加算したい！

StartDatetime__c に RequireMinutes__c を分数として追加したい！

画像の入力例だと、 2020/03/27 11:00 に30分を加算して 2020/03/27 11:30 にしたいのです。

結論はこうなりました

DATETIMEVALUE(
  TEXT(YEAR(DATEVALUE( StartDatetime__c ))) & "-" &
  LPAD(TEXT(MONTH(DATEVALUE( StartDatetime__c ))), 2, "0") & "-" &
  LPAD(TEXT(DAY(DATEVALUE( StartDatetime__c ))), 2, "0") & " " &
  LPAD(TEXT(HOUR(
    TIMEVALUE( StartDatetime__c ) + (VALUE(TEXT( RequireMinutes__c )) * 60 * 1000)
  )), 2, "0") & ":" &
  LPAD(TEXT(MINUTE(
    TIMEVALUE( StartDatetime__c ) + (VALUE(TEXT( RequireMinutes__c )) * 60 * 1000)
  )), 2, "0") &
  ":00"
)

なんかもっと楽な方法がある気がします

が、私の実力ではこうなってしまいました。

簡単に解説だけしておきます。

時間の計算はTime（時間型）に変換してから計算する

今回のキモはこれですね。

Datetime型のままで計算すると日付が加算されてしまいます。 StartDatetime__c + 1 にすると 2020/03/28 11:00 になってしまいます。

そのため今回のようにDatetimeから年、月、日、時、分を取得して計算した上で戻す事をしています。

それでは数式でやっている事を1つ1つ分解してみていきましょう。

Time型に変換
必要時間を加算
Datetime型に戻す

1. Time型に変換

TIMEVALUE( StartDatetime__c )

2. 必要時間を加算

必要時間は選択リストなので文字列→数値にする

VALUE(TEXT( RequireMinutes__c ))

Time型に追加するのでミリ秒にする

時間値の加算または減算の単位はミリ秒です。 @時間カスタム項目 - Salesforce Help

VALUE(TEXT( RequireMinutes__c )) * 60 * 1000

足す

TIMEVALUE( StartDatetime__c ) + (VALUE(TEXT( RequireMinutes__c )) * 60 * 1000)

3. Datetime型に戻す

これは簡単ですね最終的に

DATETIMEVALUE("2020-03-27 11:30")

という形式になっていればOKです

DATETIMEVALUE("2005-11-15 17:00:00") は、日時値として November 15, 2005 5:00 PM GMT を表示します。 @数式の演算子と関数 A – H - Salesforce Help

ということで文字列を作る

TEXT(YEAR(DATEVALUE( StartDatetime__c ))) & "-" &
LPAD(TEXT(MONTH(DATEVALUE( StartDatetime__c ))), 2, "0") & "-" &
LPAD(TEXT(DAY(DATEVALUE( StartDatetime__c ))), 2, "0") & " " &
LPAD(TEXT(HOUR(
  TIMEVALUE( StartDatetime__c ) + (VALUE(TEXT( RequireMinutes__c )) * 60 * 1000)
)), 2, "0") & ":" &
LPAD(TEXT(MINUTE(
  TIMEVALUE( StartDatetime__c ) + (VALUE(TEXT( RequireMinutes__c )) * 60 * 1000)
)), 2, "0") &
":00"

LPADは 3 とかを 03 にする関数です。 DATETIMEVALUE は 2020-3-5 11:30 のように0で埋まってないと表示されないのでLPADを使います。

DATETIMEVALUEでくくれば完成

はじめに書いた結論の通りになりました。

もっと簡単なやり方知ってるぞって方は是非教えてください・・・

f:id:noblejasper:20200327234805p:plain — 結果はこんな感じになりました。必要時間を変更すれば自動で計算してくれるよ

FYI

この辺のヘルプを参考にしました

2020-01-29

Lightning Web Components で外部ライブラリを使っている時に Illegal invocation が出た時は this.template.querySelector から見ていくと特定しやすいかもしれない

Salesforce Lightning Web Components JavaScript LWC GYOMUハック/Salesforce プログラム

タイトルで言い切ったやつなんですけど、詳細を書いていきます。

f:id:noblejasper:20191214115235j:plain — 最近スクーバダイビングにハマっていて12月に潜った時の写真です。内容とは一切関係ありません。

Salesforce上の Lightning Web Components（以下LWC）で、FullCalendar を使ったものを作ろうとしていて詰まった＆あんまりドキュメント見つけられなかったのでやったことを忘れないようにまとめておきます。

起きたこと

現状の結論としては、LWCの this.template.querySelector は Element じゃないっぽいのでpollyfillでこんな感じに書いていると Illegal invocation が出るぽい

const matchesMethod =
  Element.prototype.matches ||
  (Element.prototype as any).matchesSelector ||
  (Element.prototype as any).msMatchesSelector

const closestMethod = Element.prototype.closest || function (selector) {
  // polyfill
  let el = this
  if (!document.documentElement.contains(el)) {
    return null
  }
  do {
    if (elementMatches(el, selector)) {
      return el
    }
    el = el.parentElement || el.parentNode
  } while (el !== null && el.nodeType === 1)
  return null
}

細かく検証出来ていないのですが、LWC側でこういった感じでFullCalendarを使おうと思った時に私の環境では発生しました

let calendarEl = this.template.querySelector('[data-id="ScheduleAdjustmentCalendar"]');
new FullCalendar.Calendar(calendarEl, {
  plugins: ['dayGrid']
}).render();

こうやって対策してみた

私の場合は元ライブラリをforkしてブランチを切ってそこから静的リソースに持ってくるようにしてしまいました。 compareこんな感じです

if (typeof el.matches === 'function') {
  return el.matches(selector)
}

みたいに回避しちゃいました。もっといい解決策ありそうだけど。。。誰か教えて！

細かく見ていないけどきっとこうなんじゃないか仮設

Illegal invocation が出る時って「不正な呼び出し」なので違うクラスの同じメソッドをcallで呼ぼうとした時とかに出るぽいので、今回の場合 Element.prototype.closest とか Element クラスのメソッドだと思って呼んでいるけど、呼んだクラスが Element じゃない時に発生するんじゃないかなと。

事象の項にも書きましたが、おそらくですが、普通にWebサイト作ってJS呼んだときの document.querySelector は Element とか HTMLElement が返ってくるけど、LWCの this.template.querySelector はLWC独自のなにかしらのProxy的なクラスが返ってくる（HTMLElementと同等のAPIを持っているか移譲しているかはわからない）から、今回のような pollyfillで書いたコードでエラーが発生してしまうのではないかなと思っております。（これ参考文献探したけど見つけられなかったので、あくまでも推測です。）

とはいえ直接呼べるなら呼んじゃえばいいじゃん。と思って typeof el.closest が function だったらそれをそのまま呼んじゃえって書いてます。

いくつもの環境で試すとかはまだ出来ていないのですが今回はSalesforce上のLightningWebComponent上に限った話なのでこのまま行こうかなって気持ちです。

この辺りを参考にして作りました

2019-12-22

社内向けシステムを作るならとにかくSalesforceで作れ！

GYOMUハック/Salesforce プログラム技術

f:id:noblejasper:20190721181744j:plain — 効率化！最適化！今からやっていくぞ！

はじめまして、のぶじゃすと申します！

この記事は GYOMUハック/業務ハック Advent Calendar 2019 - Adventar の22日目の記事です。先日の記事が話題になったりなど、とても盛り上がっていてそのAdvent CalendarでBLOGを書けるのはとても嬉しいです！

皆様はじめまして @noblejasper と申します。私のかんたんな経歴としては

webアプリケーションエンジニア（フロントエンド、サーバサイド）
エンジニアの採用担当としてリクルーター

を経て、今年の7月ぐらいから採用業務の効率化や最適化のために採用向けのGYOMUハックをやらさせていただいております。

なにをやっているの？

シンプルに言うと、SalesforceでATS（Applicant Tracking System : 採用管理システム）のアプリ開発を行っています

今回このBLOGでは開発しているアプリケーションの詳細は説明しませんが、Salesforceに触れたのは2019年の7月からなのでまだ半年も経過していないペーペーのSalesforceエンジニアです。

はじめまして、のぶじゃすと申します！
- なにをやっているの？
おーい！みんな社内向けシステムの開発してる？
- WebアプリケーションエンジニアがSalesforceエンジニアになるのってどうなの？
社内向けシステムを作りたいならSalesforceで作れ！
さてここからが本題
- WebエンジニアがSalesforceエンジニアになるメリット
  - このBLOG読まなくてもTrailheadやっておけば余裕で作れるようになるよ
  - サーバサイドエンジニア
    - 高品質なScaffoldと、権限管理がはじめからある
    - メタ的な思考で考えないといけないことが多い
    - 大概の自動化はGUIで簡単につくれる
  - UI・フロントエンドエンジニア
    - デザインシステムがかなり完成度高く提供されている
    - コンポーネント思考のLightning Web Component
    - VSCodeで開発できる
  - SRE・インフラエンジニア
    - そもそもインフラ的業務は皆無
    - データモデリングはSalesforce開発のキモ
    - とはいえモデリングも結構可逆性高い
  - いかがでしたでしょうか？

おーい！みんな社内向けシステムの開発してる？

自社で自社の社内向けシステムを作る場面て思っている以上にたくさんあると思うんですよ。

例えば何かのデータを集めたり、集計したり、分析したりするために

GSuiteのGoogleスプレッドシートの関数やGASを駆使して表計算する
簡単なプログラムを書いてCSVを整形してみたり
メールを自動でタスク管理ツールに転送できる機能を作ってみたり

とか簡単なものから大変なものまでありますが、どれも社内向けシステムと言えるのではないでしょうか？

WebアプリケーションエンジニアがSalesforceエンジニアになるのってどうなの？

私は今Salesforceで大きめの社内向けシステムを開発しています。

まだまだ活用しきるところまではできていませんが、基本的な機能やデータ構造はできていて現場で使い始めるところまで開発できたので、開発をして感じたwebアプリケーションエンジニアがSalesforceエンジニアになるメリットみたいなものをまとめていけたらいいなと思って書いています。

社内向けシステムを作りたいならSalesforceで作れ！

結論から言うと、社内向けシステムを作るのであれば絶対にSalesforceで開発するほうがいいです。細かい理由は後述のメリットなどで書こうと思いますが、

早く作れる
早く直せる
余計に作らないといけないものがほぼ無い

他にもたくさんありそうですが、私が思う大きい理由はこんなところです。

さてここからが本題

前置きが長くなりましたが、ここからが本題です！

f:id:noblejasper:20191222160317j:plain — やっと本題だっ！おなかへったなー

WebエンジニアがSalesforceエンジニアになるメリット

Webエンジニアと言っても最近ではポジションも細分化され、いろいろなスキルセットがある思っています。私の独断と偏見でWebエンジニアのポジションごとにSalesforce開発でメリットになるであろう部分をまとめてみようと思います。

私が今まで経験してきた

サーバサイドエンジニア
UI・フロントエンドエンジニア
SRE・インフラエンジニア

の軸で書いていきます！

2019-12-19

iMacをターゲットディスプレイモードで使う時には純正のケーブルを使え。それでも尚ハマる

Apple Amazon ツール

我が家にはiMac (27-inch, Late 2013)があるんですが、特に買い替えが必要だとは思っていなくて、全然現役です。

しかしMacBookProのサブディスプレイとして使いたい場面があり、繋げたいなーと思っていました。そんな時に便利なのがターゲットディスプレイモード！

使い方や切替方法などは今回説明しません。Apple公式のヘルプのほうが詳しいので読んでみてください。

support.apple.com

まずは失敗した話！同じ環境の人はこれは買ってはダメ！！

あのMiniDisplayPortみたいな穴（正しくはThunderbolt2という穴）とMacbookProのUSB-Cがつながればええんじゃろ？って思ってあまり考えずにAmazonでケーブルを探してポチッと。

少なくとも我が家のiMacさんはこのケーブルではうんともすんとも言いませんでした。

usb type c mini displayport 変換ケーブルタイプＣ(Thunderbolt 3対応)転換DPケーブル usb c to ミニディスプレイポートcable 音声サポート18ヶ月安心保証 2017/2016 MacBook Pro, MacBook Galaxy S8/S8 Plus

メディア: エレクトロニクス

これじゃダメらしい。

MiniDisplayPortとThunderboltって一緒なのでは？

MiniDisplayPortではなくThunderbolt2という形式のケーブルが必要と公式ヘルプには書いてある。

穴の形一緒じゃね？？？一緒のものではないの？？？

f:id:noblejasper:20191216200819p:plain — Late2013のiMacに必要なのはLightningケーブル

Thunderbolt および Thunderbolt 2 は、Mini DisplayPort とは別物です (形状は同じですが、ケーブルやポートに付いている記号が違います)。ただし、このポートは Mini DisplayPort でのビデオ出力には対応しているので、Mini DisplayPort ケーブルを使って Mini DisplayPort ディスプレイを接続することができます。

support.apple.com

別物です！

じゃあどのケーブルを買えばいいのさ！？

これです。これなら繋がりました。

Apple Apple Thunderboltケーブル (0.5 m)

メディア: Personal Computers

そしてMacbookPro側に最近だとThunderbolt2のポートは存在しないので、 Thunderbolt2をType-cに変換するのはこちらです。

Apple Thunderbolt 3(USB-C)- Thunderbolt 2アダプタ

発売日: 2016/10/28
メディア: Personal Computers

純正を使ってください。これで繋げてダメだったらAppleのサポートに問い合わせられます！（強い）

つなげたけど画面真っ暗だった

これは調べてみたら設定と操作で回避する解決策がありました。

discussionsjapan.apple.com

のやりとりの一番下の回答の方法でやったら正常に画面がつきました！

Macbook Proのホットコーナー機能で、Macbook ProのディスプレイをOffにできるようにします。

ともにログイン済みのMacbook ProとiMacをケーブルで接続します。

Macbook Proのディスプレイを、ホットコーナー機能でOffにします。

iMacでCommand+F2を押し、ターゲットディスプレイをオンにします。

Macbook ProのディスプレイをOnにします。

iMacのバックライトが点灯し、正しく動作させることが出来ます。