See the Github repository I created about it.

To remove this behavior, and load the webpart as soon as possible, you must declare your webpart as a dynamic data source.

Here is the minimal code example (in pure JS, not in TS):

import { BaseClientSideWebPart } from '@microsoft/sp-webpart-base';
import { DisplayMode } from '@microsoft/sp-core-library';

export default class HtmlViewerWebPart extends BaseClientSideWebPart {
  constructor() {
    super();
    // the below is used by the dynamic data source to avoid lazy loading
    this._sourceId = 'my_webpart';
  }

  onInit() {
    // to avoid lazy loading of the webpart, we register it as a dynamic data source
    // we only need to do it during the Edit of the page
    if (this.isPageInEditMode() && this.context.dynamicDataSourceManager) {
      this.context.dynamicDataSourceManager.initializeSource(this);
      console.log('Dynamic Data Source initialized to avoid lazy loading.');
    }
    
    return Promise.resolve();
  }

  isPageInEditMode() {
    return this.displayMode === DisplayMode.Edit;
  }

  // we need to declare this method because it's used by the data source to avoid lazy loading
  getPropertyDefinitions() {
    return []
  }

  // we need to declare this method because it's used by the data source to avoid lazy loading
  getPropertyValue(propertyId) {
    return propertyId;
  }
}

Then, edit the page, which will trigger the dynamic data source registration, and publish it.

Let’s define the properties:

@property --_x {
  syntax: "<number>";
  inherits: true;
  initial-value: 0; 
}
@property --_y {
  syntax: "<number>";
  inherits: true;
  initial-value: 0; 
}
@property --w {
  syntax: "<integer>";
  inherits: true;
  initial-value: 0; 
}
@property --h {
  syntax: "<integer>";
  inherits: true;
  initial-value: 0; 
}

Then, let’s find an element that is a common parent for both the element where we’ll calculate the height/width, and the element that will use this height/width, and we apply some CSS:

.parent {
  timeline-scope: --cx,--cy;
  --w:calc(1/(1 - var(--_x)));
  --h:calc(1/(1 - var(--_y)));
  animation: x linear,y linear;
  animation-timeline: --cx,--cy !important;
  animation-range: entry 100% exit 100%;
}

We finish up with some additional CSS:

.get-dimension {
  overflow: hidden;
  position: relative;
}
.get-dimension:before {
  content:"";
  position: absolute;
  left: 0;
  top: 0;
  width: 1px;
  aspect-ratio: 1;
  view-timeline: --cx inline,--cy block;
}
@keyframes x {to{--_x:1}}
@keyframes y {to{--_y:1}}

And finally, we can use --w and --h in the other element:

.apply-dimension {
  height: calc(var(--h)*1px);
  width: calc(var(--w)*1px);
}

Here is a demo:

1. Go to the MS Teams Settings by clicking on the three dots next to your profile picture
2. Go to Accounts and orgs
3. Turn off or leave the org/account that is problematic

To have a good version of Android TV 9:

1. Downlad a VirtualBox image of it – I used the one shared in this video
2. Install VirtualBox if you don’t have it yet
3. Load the downloaded image with VirtualBox
4. Configure it by going to the network section and select “Bridged Adapter” instead of “NAT”
5. Once Android TV is started, you’ll have to connect to your Google account, but using the keyboard might be challenging – you can right click on the USB cable icon that appears at the bottom right of the VirtualBox window, and select your keyboard (be aware it’s a QWERTY map that is used)

After that, go to the Android TV settings, in the “About” section, and click several times on the Build Version to enable the Developer Mode. From the developer menu, you can enable the “Debug USB”.

Once everything is correctly configured, the Android TV should be visible on your local network, meaning you can use the ADB command to test your app.

Start a new project

1. In a new folder, type npm init to start a new project.
2. Make sure to use a Node >= v14 (I use Node v18 – and Volta can be useful to manage several versions of Node for Windows)
3. Install some dependencies: npm install axios @azure/msal-node uuid

Certificate

In the past, we could use the add-in application feature to get a token, but Microsoft announced it will be retired.

We now need to pass through an Azure application to get it. But before creating the Azure app, we need to create a Private Certificate key.

1. Create the file Create-SelfSignedCertificate.ps1 using the below code (source):

#Requires -RunAsAdministrator
<#
.SYNOPSIS
Creates a Self Signed Certificate for use in server to server authentication
.DESCRIPTION
Source: https://learn.microsoft.com/en-us/sharepoint/dev/solution-guidance/security-apponly-azuread#setting-up-an-azure-ad-app-for-app-only-access
.EXAMPLE
.\Create-SelfSignedCertificate.ps1 -CommonName "MyCert" -StartDate 2015-11-21 -EndDate 2017-11-21
This will create a new self signed certificate with the common name "CN=MyCert". During creation you will be asked to provide a password to protect the private key.
.EXAMPLE
.\Create-SelfSignedCertificate.ps1 -CommonName "MyCert" -StartDate 2015-11-21 -EndDate 2017-11-21 -Password (ConvertTo-SecureString -String "MyPassword" -AsPlainText -Force)
This will create a new self signed certificate with the common name "CN=MyCert". The password as specified in the Password parameter will be used to protect the private key
.EXAMPLE
.\Create-SelfSignedCertificate.ps1 -CommonName "MyCert" -StartDate 2015-11-21 -EndDate 2017-11-21 -Force
This will create a new self signed certificate with the common name "CN=MyCert". During creation you will be asked to provide a password to protect the private key. If there is already a certificate with the common name you specified, it will be removed first.
#>
Param(

[Parameter(Mandatory=$true)]
   [string]$CommonName,

[Parameter(Mandatory=$true)]
   [DateTime]$StartDate,

[Parameter(Mandatory=$true)]
   [DateTime]$EndDate,

[Parameter(Mandatory=$false, HelpMessage="Will overwrite existing certificates")]
   [Switch]$Force,

[Parameter(Mandatory=$false)]
   [SecureString]$Password
)

# DO NOT MODIFY BELOW
function CreateSelfSignedCertificate(){
  #Remove and existing certificates with the same common name from personal and root stores
    #Need to be very wary of this as could break something
    if($CommonName.ToLower().StartsWith("cn="))
    {
        # Remove CN from common name
        $CommonName = $CommonName.Substring(3)
    }
    $certs = Get-ChildItem -Path Cert:\LocalMachine\my | Where-Object{$_.Subject -eq "CN=$CommonName"}
    if($certs -ne $null -and $certs.Length -gt 0)
    {
        if($Force)
        {

foreach($c in $certs)
            {
                remove-item $c.PSPath
            }
        } else {
            Write-Host -ForegroundColor Red "One or more certificates with the same common name (CN=$CommonName) are already located in the local certificate store. Use -Force to remove them";
            return $false
        }
    }

$name = new-object -com "X509Enrollment.CX500DistinguishedName.1"
    $name.Encode("CN=$CommonName", 0)

$key = new-object -com "X509Enrollment.CX509PrivateKey.1"
    $key.ProviderName = "Microsoft RSA SChannel Cryptographic Provider"
    $key.KeySpec = 1
    $key.Length = 2048
    $key.SecurityDescriptor = "D:PAI(A;;0xd01f01ff;;;SY)(A;;0xd01f01ff;;;BA)(A;;0x80120089;;;NS)"
    $key.MachineContext = 1
    $key.ExportPolicy = 1 # This is required to allow the private key to be exported
    $key.Create()

$serverauthoid = new-object -com "X509Enrollment.CObjectId.1"
    $serverauthoid.InitializeFromValue("1.3.6.1.5.5.7.3.1") # Server Authentication
    $ekuoids = new-object -com "X509Enrollment.CObjectIds.1"
    $ekuoids.add($serverauthoid)
    $ekuext = new-object -com "X509Enrollment.CX509ExtensionEnhancedKeyUsage.1"
    $ekuext.InitializeEncode($ekuoids)

$cert = new-object -com "X509Enrollment.CX509CertificateRequestCertificate.1"
    $cert.InitializeFromPrivateKey(2, $key, "")
    $cert.Subject = $name
    $cert.Issuer = $cert.Subject
    $cert.NotBefore = $StartDate
    $cert.NotAfter = $EndDate
    $cert.X509Extensions.Add($ekuext)
    $cert.Encode()

$enrollment = new-object -com "X509Enrollment.CX509Enrollment.1"
    $enrollment.InitializeFromRequest($cert)
    $certdata = $enrollment.CreateRequest(0)
    $enrollment.InstallResponse(2, $certdata, 0, "")
    return $true
}

function ExportPFXFile()
{
    if($CommonName.ToLower().StartsWith("cn="))
    {
        # Remove CN from common name
        $CommonName = $CommonName.Substring(3)
    }
    if($Password -eq $null)
    {
        $Password = Read-Host -Prompt "Enter Password to protect private key" -AsSecureString
    }
    $cert = Get-ChildItem -Path Cert:\LocalMachine\my | where-object{$_.Subject -eq "CN=$CommonName"}

    Export-PfxCertificate -Cert $cert -Password $Password -FilePath "$($CommonName).pfx"
    Export-Certificate -Cert $cert -Type CERT -FilePath "$CommonName.cer"
}

function RemoveCertsFromStore()
{
    # Once the certificates have been been exported we can safely remove them from the store
    if($CommonName.ToLower().StartsWith("cn="))
    {
        # Remove CN from common name
        $CommonName = $CommonName.Substring(3)
    }
    $certs = Get-ChildItem -Path Cert:\LocalMachine\my | Where-Object{$_.Subject -eq "CN=$CommonName"}
    foreach($c in $certs)
    {
        remove-item $c.PSPath
    }
}

if(CreateSelfSignedCertificate)
{
    ExportPFXFile
    RemoveCertsFromStore
}

2. Open a PowerShell console as an administrator
3. Create the certificate with a command like .\Create-SelfSignedCertificate.ps1 -CommonName "SharePointOnlinePrivateKey" -StartDate 2024-04-01 -EndDate 2035-01-01 (if you receive an error, make sure to allow running this kind of script with the command Set-ExecutionPolicy RemoteSigned)
4. A password is required (e.g. "HereIsMyPass1223")
5. Two files are created: SharePointOnlinePrivateKey.pfx and SharePointOnlinePrivateKey.cer

We're going to install OpenSSL to convert the pfx file to a pem:

1. Install OpenSSL (e.g. the light version for Win64) as an administrator
2. Find the OpenSSL installation directory (e.g. C:\Program Files\OpenSSL-Win64\)
3. Open the start.bat file from this OpenSSL directory
4. A command window opens – go to the directory where the SharePointOnlinePrivateKey.pfx file is (e.g. cd C:\Users\Aymeric\Documents\nodejs\spo-experiments)
5. In the OpenSSL command window, type openssl pkcs12 -in SharePointOnlinePrivateKey.pfx -out SharePointOnlinePrivateKey.pem (the password entered in the previous steps will be asked three times)

We should now have a file called SharePointOnlinePrivateKey.pem

Azure Application

It's time to create the related Azure application:

1. Go to https://portal.azure.com
2. Go to the Microsoft Entra ID section
3. Go to the "App Registrations", and click on "New registration"
4. I won't detail all the steps to create the app
5. Give a name to the app (e.g. "SharePoint Online Remote Access")

Get Thumbprint

We need the thumbprint:

1. Go to "Certificates & secrets" section
2. Go to "Certificates" tab (see how) and upload the SharePointOnlinePrivateKey.cer file you created before
3. Once uploaded, it will provide "Thumbprint" (e.g. "F7D8D4F2F140E79B215899BD93A14D0790947789") – copy this value for a later use.

Get Client Id and Tenant Id

We need the clientId and the tenantId:

1. From the overview page of your app, copy the "Application (client) Id" (e.g. "75284292-7515-4e2f-aae9-d1777527dd7b") and the "Directory (tenant) ID" (e.g. "945c177a-83a2-4e80-9f8c-5a91be5752dd")

Platform configuration

Additional configuration required for the application:

1. Go to "Authentication" menu, and under "Platform configurations", click on "Add a Platform"
2. Choose "Web" and enter https://localhost for "Redirect URLs"
3. Choose "Access Token" and "ID Token" in the "Implicit grant and hybrid flows" section

API Permissions

We want to give the permissions to the Azure app to get access to only one (or more) specific Sites Collection, but not all of the tenant site collections. To do so, we only need the Sites.Selected permissions (ref1 and ref2).

First, let's select it from a Microsoft Graph perspective:

1. Go to the "API Permissions" section from the left navigation
2. Click on "Add a permission"
3. Select "Microsoft Graph"
4. Then "Application Permissions"
5. Select "Sites.Selected"

Then, let's select it for SharePoint Online REST perspective:

1. From the same section, select "SharePoint"
2. Then "Application Permissions"
3. Select "Sites.Selected"

Remark: you might need to contact the IT team to get your API Permissions approved/granted.

Get Client Secret

We need the clientSecret:

1. Go to the "Certificates and Secrets" section from the left navigation
2. Go to "Client Secret" and click on "New client secret"
3. In "Description" you can put something like "SharePoint Online Remote Access", and choose 365 days for the expiration
4. Once done, make sure to copy Value (e.g. "rVE7Q~Z1BhRXaljbj7SPg~U2HYJRR-feckrxKbCt") that is our clientSecret

App permissions on Site Collection

It's time to indicate that the Azure application can have access to a specific Site Collection (e.g. https://mycompany.sharepoint.com/sites/contoso).

To proceed, we need the siteId:

1. Go to the SharePoint website (e.g. https://mycompany.sharepoint.com/sites/contoso)
2. Click right in the page to see the source (or CTRL U)
3. Search for the variable siteId (e.g. "7d6d9e18-e8de-4b7c-9582-3f978726f356")

To give the permissions to the app, a special command must be entered (see this video for more information). In theory, the site collection admin can do it, but it might be restricted in your organization, and you'll need the assistance of a tenant admin.

We need the AppId (as known as clientId) and DisplayName (as known as the Azure app name):

$targetSiteUri = 'https://mycompany.sharepoint.com/sites/contoso'
Connect-PnpOnline $targetSiteUri
Grant-PnPAzureADAppSitePermission -AppId '75284292-7515-4e2f-aae9-d1777527dd7b' -DisplayName 'SharePoint Online Remote Access' -Site $targetSiteUri -Permissions Write

Interact with SharePoint

Microsoft Graph only needs a client_secret, while SharePoint REST API needs a client_assertion from the Certificate Private key.

So, let's start with Microsoft Graph to verify our Azure app has the correct access permissions.

Microsoft Graph

Below is the script we can use:

const axios = require('axios');

// our constants that we found previously
// they should not be hard-coded in your script, but store in a safe place
const tenantId = '945c177a-83a2-4e80-9f8c-5a91be5752dd';
const clientId = '75284292-7515-4e2f-aae9-d1777527dd7b';
const clientSecret = 'rVE7Q~Z1BhRXaljbj7SPg~U2HYJRR-feckrxKbCt';
const siteId = '7d6d9e18-e8de-4b7c-9582-3f978726f356';

async function getAccessToken() {
  const resource = 'https://graph.microsoft.com';

  try {
    const response = await axios.post(`https://login.microsoftonline.com/${tenantId}/oauth2/v2.0/token`, new URLSearchParams({
      grant_type: 'client_credentials',
      client_id: clientId,
      client_secret: clientSecret,
      scope: `${resource}/.default`
    }), {
      headers: {
        'Content-Type': 'application/x-www-form-urlencoded'
      }
    });

    return response.data.access_token;
  } catch (error) {
    console.error('Error getting access token:', error);
    throw error;
  }
}

// get a SharePoint item using Graph
getAccessToken()
.then(token => {
  // we need to find the siteId for each level
  // we could use `https://graph.microsoft.com/v1.0/sites/${siteId}/sites` to find the children sites Id
  // mycompany.sharepoint.com/sites/contoso/Toolbox -> 919f3ff8-2cfd-469d-ac2c-cf58475ee72a
  // mycompany.sharepoint.com/sites/contoso/Toolbox/Demo -> 37af7205-ebd1-49e5-a770-cdb182d2ae81
  return axios.get(`https://graph.microsoft.com/v1.0/sites/${siteId}/sites/919f3ff8-2cfd-469d-ac2c-cf58475ee72a/sites/37af7205-ebd1-49e5-a770-cdb182d2ae81/lists/Assets/items/123?expand=fields(select=Title)`, {
    headers:{
      'Authorization':'Bearer '+token,
      'Accept': 'application/json'
    }
  })
})
.then(res => {
  console.log(res.data);
})
.catch(err => {
  console.log("err => ", err.response.data)
})

SharePoint Online REST API

If it worked with the Graph version, it means we can now test with the SharePoint REST API:

const axios = require('axios');
const fs = require("fs");
const crypto = require("crypto");
const msal = require("@azure/msal-node");
const { v4: uuid } = require('uuid');

// our constants that we found previously
// they should not be hard-coded in your script, but store in a safe place
const tenantId = '945c177a-83a2-4e80-9f8c-5a91be5752dd';
const clientId = '75284292-7515-4e2f-aae9-d1777527dd7b';
const clientSecret = 'rVE7Q~Z1BhRXaljbj7SPg~U2HYJRR-feckrxKbCt';
const resource = 'https://mycompany.sharepoint.com';
const privateKeyPassPhrase = "HereIsMyPass1223";
const thumbprint = "F7D8D4F2F140E79B215899BD93A14D0790947789";

// generate the client_assertion
function getClientAssertion () {
  // source: https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-node/docs/certificate-credentials.md
  // decrypt the private key
  const privateKeySource = fs.readFileSync("./SharePointOnlinePrivateKey.pem");
  const privateKeyObject = crypto.createPrivateKey({
      key: privateKeySource,
      passphrase: privateKeyPassPhrase,
      format: "pem",
  });

  const privateKey = privateKeyObject.export({
      format: "pem",
      type: "pkcs8",
  });
  
  const config = {
    auth: {
      clientId: clientId,
      authority: `https://login.microsoftonline.com/${tenantId}`,
      clientCertificate: {
        thumbprint: thumbprint, // a 40-digit hexadecimal string
        privateKey: privateKey,
      },
    },
  };

  // Create msal application object
  const cca = new msal.ConfidentialClientApplication(config);
  const helper = {
    createNewGuid:uuid
  }
  const issuer = clientId;
  const jwtAudience = `https://login.microsoftonline.com/${tenantId}/oauth2/v2.0/token`;
  return cca.clientAssertion.getJwt(helper, issuer, jwtAudience);
}

async function getAccessToken() {
  // see https://github.com/SharePoint/sp-dev-docs/issues/5889 and https://learn.microsoft.com/en-us/entra/identity-platform/v2-oauth2-client-creds-grant-flow#second-case-access-token-request-with-a-certificate
  try {
    const response = await axios.post(`https://login.microsoftonline.com/${tenantId}/oauth2/v2.0/token`, new URLSearchParams({
      client_id: clientId,
      scope: `${resource}/.default`,
      client_assertion_type: "urn:ietf:params:oauth:client-assertion-type:jwt-bearer",
      client_assertion: getClientAssertion(),
      grant_type: 'client_credentials',
    }), {
      headers: {
        'Content-Type': 'application/x-www-form-urlencoded'
      }
    });

    return response.data.access_token;
  } catch (error) {
    console.error('Error getting access token:', error);
    throw error;
  }
}

// run the script
getAccessToken()
.then(token => {
  return axios.get(`https://mycompany.sharepoint.com/sites/contoso/Toolbox/Demo/_api/web/lists/getbytitle('Assets')/items(123)?$select=Title`, {
    headers:{
      'Authorization':'Bearer '+token,
      'Accept': 'application/json; odata=verbose'
    }
  })
})
.then(response => {
  console.log(response.data)
})
.catch(console.log)

1. Install it on a computer where the automatic install works
2. On the target computer, download ep_setup.exe from the official website
3. Open a Terminal and extract the files from the setup using the command ep_setup.exe /extract
4. Several files have been extracted from the setup
5. Move all the files to C:\Program Files\ExplorerPatcher
6. Kill Windows Explorer from the Task Manager
7. From the computer in step 1, copy the file C:\Windows\dxgi.dll and paste it to the target computer at the same location
8. Restart Windows Explorer from a Terminal by typing explorer.exe

Then if it either returns “fieldName is not part of the object params” or the value.

We can use it to check if a date field is empty in a SharePoint List, because when getting the data from the SP List, when the date field is empty, it’s not in the result returned – the below code will return true if the date field is empty:
empty(item()?['dateFieldNameId'])

For a Currency/Number field you need to use string() as well:
empty(string(item()?['floatFieldNameId']))

After investigating, to resolve this issue you need to open the “details” view of your child flow, and click on the “Edit” button from the “Run only users” card:

Then in the Connections Used section, make sure to select “Use this connection (your_username@domain.com)” instead of the default “Provided by run-only user”. It will permit to run this child flow with your rights.

The solution is to use another end point _api/site/getrecyclebinitems (see the documentation for the various parameters):

fetch("https://tenant.sharepoint.com/sites/YourSite/_api/site/getrecyclebinitems?rowLimit=%2770000%27&itemState=0&orderby=3&isAscending=false", {
  "headers": {
    "accept": "application/json",
    "content-type": "application/json",
    "x-requestdigest": document.querySelector("#__REQUESTDIGEST").value
  },
  "method": "GET",
})
.then(res => res.json())
.then(json => {
  console.log(json.value);
  // it will show an array with an object that contains several interesting properties:
  // AuthorEmail, AuthorName, DeletedByEmail, DeletedDate, DirName, Id, LeafName, Title, …
})

You can then filter the result to get what you need, for example if you’re looking for an item from the list “Projects” that has the ID 1981:

json.value.filter(item => item.DirName.includes("Lists/Projects") && item.LeafName === "1981_.000");

Then, to restore an item, we need the Id from the previous result. The famous endpoint to restore an item is _api/site/RecycleBin('Id')/restore, however it could also return the error “The attempted operation is prohibited because it exceeds the list view threshold”. In that case, we can use this other endpoint _api/site/RecycleBin/RestoreByIds:

fetch("https://tenant.sharepoint.com/sites/YourSite/_api/site/RecycleBin/RestoreByIds", {
  "headers": {
    "accept": "application/json",
    "content-type": "application/json",
    "x-requestdigest": document.querySelector("#__REQUESTDIGEST").value
  },
  "method": "POST",
  "body":JSON.stringify({
    "ids": [
      "4f855ee7-472b-414a-a482-4317a114c1a2" // Id to restore
    ],
    "bRenameExistingItems": true
  })
})

async function hmac_sha1 (str, secret) {
  // see https://stackoverflow.com/a/47332317/1134119
  let enc = new TextEncoder("utf-8");
  let key = await window.crypto.subtle.importKey(
    "raw", // raw format of the key - should be Uint8Array
    enc.encode(secret),
    { // algorithm details
      name: "HMAC",
      hash: {name: "SHA-1"}
    },
    false, // export = false
    ["sign", "verify"] // what this key can do
  );
  let signature = await window.crypto.subtle.sign(
    "HMAC",
    key,
    enc.encode(str)
  );
  let b = new Uint8Array(signature);
  return Array.prototype.map.call(b, x => x.toString(16).padStart(2, '0')).join("");
}

(source)

You’ll need credentials:

• `clientId` – required string, client id obtained when registering the addin
• `clientSecret` – required string, client secret obtained when registering the addin
• `realm` – your SharePoint Online tenant id. The easiest way to find tenant is to open SharePoint Online site collection, click Site Settings → Site App Permissions. Under this page you wll see at least one app “Microsoft.SharePoint”. The tenant id (realm) is highlighted in the image below:
  

Example of the expected result:

{
  clientId: '28bq7e56-8c3a-487d-hbfb-ef1a74539cbe',
  clientSecret: 's6LZ4VvoeKOS+MyAhklcavsyJBF4XhWo06OgY6czYJ0=',
  realm: '85e5f09b-4c17-4d80-afea-260bb171c456'
}

To get the credentials, you need to register a new addin inside SharePoint Online, by fellowing these steps:

1. Open SharePoint Online app registration page, e.g. https://contoso.sharepoint.com/sites/dev/_layouts/15/appregnew.aspx
2. Click on “Generate” for Client id and Client Secret, fill in Title, App Domain, Redirect URI (you can type in any values you want)
   
3. Click on “Create” and save generated Client Id and Client Secret
4. [IF YOU HAVE TENANT RIGHTS] Now you need to apply permissions to the newly registered app. If you want to register the app once and use it for any site collection, it’s better to apply tenant scope permissions, so you can use the credentials everywhere inside your SharePoint tenant. To apply tenant scoped permissions, open AppInv.aspx page under SharePoint adminstration web site, e.g. https://[YOUR_ORGANIZATION]-admin.sharepoint.com/_layouts/15/appinv.aspx, copy paste Client Id from step n°3 into App Id field and click “Lookup”.
5. [IF YOU HAVE TENANT RIGHTS] You will see your registered app, paste in the following XML into the “Permission Request XML” field and click “Create”:

       <AppPermissionRequests AllowAppOnlyPolicy="true">
         <AppPermissionRequest Scope="http://sharepoint/content/tenant" Right="FullControl" />
       </AppPermissionRequests>
   

   

6. [IF YOU ARE NOT A TENANT] If you only want to give permissions on 1 site collection, you can register the app on a regular site collection by using url https://contoso.sharepoint.com/sites/dev/_layouts/15/appinv.aspx. In this case you are not able to use tenant scoped permissions and can only apply site collection permissions:

       <AppPermissionRequests AllowAppOnlyPolicy="true">
         <AppPermissionRequest Scope="http://sharepoint/content/sitecollection" Right="FullControl" />
       </AppPermissionRequests>
   

7. You will see addin “Trust” confirmation, click on “Trust It”:
   
   if trust-it button is not enabled and you get a red label saying tenant admin needs to trust the app, go back and try again in a few minutes.
8. Now you can use client id and client secret to send authenticated http requests.

To know more about the XML permissions, you can check the Microsoft documentation.

Get Access Token

(you can find a C# code as an example)

You need to do a POST request to https://accounts.accesscontrol.windows.net/[YOUR_TENANT_REALM]/tokens/OAuth/2 with a “Content-Type” header that has the value “application/x-www-form-urlencoded”, and the body parameters that must be:

• "grant_type":"client_credentials"
• "client_id":"[YOUR_CLIENT_ID]@[YOUR_TENANT_REALM]"
• "client_secret":"[YOUR_CLIENT_SECRET]"
• "resource":"00000003-0000-0ff1-ce00-000000000000/dell.sharepoint.com@[YOUR_TENANT_REALM]"

See below an example in PHP:

$curl = curl_init();
curl_setopt($curl, CURLOPT_URL, "https://accounts.accesscontrol.windows.net/[YOUR_TENANT_REALM]/tokens/OAuth/2");
curl_setopt($curl, CURLOPT_HTTPHEADER, [ "Content-Type: application/x-www-form-urlencoded" ]);
curl_setopt($curl, CURLOPT_POSTFIELDS, http_build_query([
  "grant_type" => "client_credentials",
  "client_id" => "[YOUR_CLIENT_ID]@[YOUR_TENANT_REALM]",
  "client_secret" => "[YOUR_CLIENT_SECRET]",
  "resource" => "00000003-0000-0ff1-ce00-000000000000/dell.sharepoint.com@[YOUR_TENANT_REALM]"
]));
curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
$response = json_decode(curl_exec($curl));
curl_close($curl);

echo $response->access_token;

The response should contain an access token. Example:

{
  "token_type":"Bearer",
  "expires_in":"86399",
  "not_before":"1679393911",
  "expires_on":"1679480611",
  "resource":"00000003-0000-0ff1-ce00-000000000000/dell.sharepoint.com@[YOUR_TENANT_REALM]",
  "access_token":"eyJ0eXAiOiJKV1QiLCJhbGciOiJSU[...]SxXA5Lqbk1OcOVdwQ"
}

Finally, you can do your REST API request to SharePoint Online with passing the header “Authorization” that has the value “Bearer [YOUR_ACCESS_TOKEN]”.

No development certificate found. Generate a new certificate manually, or set the `canGenerateNewCertificate` parameter to `true` when calling `ensureCertificateAsync`

To resolve, you can type gulp trust-dev-cert.

We first need a manifest.yml file that contains:

---
applications:
- name: APP-NAME
  buildpack: nodejs_buildpack
  no-route: true
  health-check-type: process
  env:
    OPTIMIZE_MEMORY: true

The no-route parameter is true so that we don’t get a route assigned, and the health-check-type is set to process so that the orchestrator monitors process availability and doesn’t try to ping a non-existent web endpoint. And OPTIMIZE_MEMORY in “env” section is based on the Pivotal recommendations.

If you need to use a local package in your app, you’ll have to pack it up first. To do it, go to your local module folder, and type npm pack. It will create a .tgz file that you’ll have to store in a local_modules folder for your app. Next, use npm install .\local_modules\package-1.2.3.tgz.

You can now deploy your app with pcf push APP-NAME and you can read the logs with cf logs APP-NAME --recent.

There is a workaround with “Transform data using Power Query” (ATTENTION: you cannot load it from a flow from a Solution… you’ll have to go to your Flows and edit the flow from there):

Let’s say we have 3 tables: ITEM_CATALOG, CATALOG and CURRENCY. We want to join them and filter them based on a variable found previously in our flow.

First, we can define our where. Here I have several values that I want to test using a IN:

I create a string with my different values separated by a coma.

Next, we can open the Power Query editor:

In the interface, we choose the 3 tables we need to merge and we add a parameter called “where”:

We rename it to “where” and leave the default settings:

Then we use the “Advance Editor”:

And we wrote the below:

let
  where = Text.Split( "@{variables('where')}" , ",")
in
  where

It means we want to split the variable “where” coming from the flow, based on the coma separator:

We can now merge the tables and add a filter:

And when the step to filter is here, we select “in” and our query:

Last step is to “Enable Load” to make sure this is what the operation will return to our flow:

You can run it to test and see if it works.

Then, to get the output from it, we’ll use a “Parse JSON”… The schema is probably something like:

{
    "type": "object",
    "properties": {
        "resultType": {
            "type": "string"
        },
        "value": {
            "type": "array",
            "items": {
                "type": "object",
                "properties": {
                    "COLUMN_A": {
                        "type": "string"
                    },
                    "COLUMN_B": {
                        "type": "integer"
                    },
                    "COLUMN_C": {
                        "type": "string"
                    }
                },
                "required": [
                    "COLUMN_A",
                    "COLUMN_B",
                    "COLUMN_C"
                ]
            }
        }
    }
}

You may need to make several tries in order to find the correct schema. You can also use the “Generate from sample” by pasting the data from the previous step:

We use “value” in the loop:

And then we can access our columns:

Important warning: when you use PowerApps to manage your form, all edits to the list settings won’t reflect to the PowerApps form. For example, if you add a field, it won’t show up, and you’ll have to manually update the PowerApps to add it (see at the bottom of this article).

From the list view, go to Integrate then PowerApps and Customize forms:

Once PowerApps has open the form, you need to do several things.

1. Load the ID

We first need to make sure the form will load the required item when we pass the ID URL parameter:

From the SharepointForm Advanced Settings, we change the DefaultMode to check if we have the ID parameter, and if we don’t have it, then it should be a New Form, otherwise an Edit Form:

If(IsBlank(Param("ID")), FormMode.New, FormMode.Edit)

From the SharepointForm Advanced Settings, we change the Item section to check if we have the ID parameter, and if we have it, then we do a lookup in our list to find the data:

If(IsBlank(Param("ID")), SharePointIntegration.Selected, LookUp('NAME OF THE LIST', ID = Value(Param("ID"))))

Add a SUBMIT button

With PowerApps, there is no button to save the changes! We’ll add a button in the form:

In the button’s properties, we change the onSelect to be:

SubmitForm(SharePointForm1)

Be aware that the page will stay with the form after clicking on the button. You could want to close using the Exit() function, but the user will be redirected on office.com … I’d recommend to use Launch() by redirecting your users to a page:

SubmitForm(SharePointForm1); Launch("https://tenant.sharepoint.com/sites/MySite/");

Set field’s value based on URL parameter

We can finally set the field’s value based on the parameter in the URL. Select the INPUT zone of the field, and in the Default section we use the below formula:

If(IsBlank(Param("Title")), ThisItem.Title, Param("Title"))

Here my field is called “Title” so I decided to use a parameter called “Title” as well.

Link to the form

We cannot use the NewForm.aspx or EditForm.aspx to access this form, but we need a special link.

Go to your list settings:

Then go to the form settings (it’s from there that you can decide to keep PowerApps or use the original Sharepoint Forms), and click on See versions and usage:

You’ll get the App Id from this page:

Next, you’ll use the App Id to forge the URL: https://apps.powerapps.com/play/providers/Microsoft.PowerApps/apps/APP_ID
With our example, the URL will be: https://apps.powerapps.com/play/providers/Microsoft.PowerApps/apps/c6f23ac1-dcbd-4daf-925e-2701ab241ca0

You can now pass the URL parameter: https://apps.powerapps.com/play/providers/Microsoft.PowerApps/apps/APP_ID?Title=Hello%20World
And an ID to retrieve an existing item: https://apps.powerapps.com/play/providers/Microsoft.PowerApps/apps/APP_ID?Title=Hello%20World&ID=2

How to use it with a LookUp column?

If you want to auto-select a LookUp field using an URL parameter, you need to do a few things…

First, we need to add the related table. To do so, click on Data in the left navigation bar and search for SharePoint:

Search for the table and add it.

Second (optional) step: click on the Lookup field in the form and change the Items to show a list of options – if no “Lookup” ID in the URL, then we use the default list of options:

The below formula permits to retrieve the “ID” and “Title” from the distant list, base on the “Lookup” parameter, and to rename the result as {Id:"ID", Value:"Title"}:

If(IsBlank(Param("Lookup")), Choices([@'CURRENT LIST NAME'].COLUMN_NAME), RenameColumns(ShowColumns(Filter('DISTANT LIST NAME', ID = Value(Param("Lookup"))), "ID", "Title"), "ID", "Id", "Title", "Value"))

Third, click on the Lookup field in the form and change the DefaultSelectedItems to select the item from the list of options:

The below formula returns an empty selection with {Id:"", Value:""} when no URL param, otherwise it returns the first record for our lookup:

If(IsBlank(Param("Lookup")), {Id:"", Value:""}, First(RenameColumns(ShowColumns(Filter('DISTANT LIST NAME', ID = Value(Param("Lookup"))), "ID", "Title"), "ID", "Id", "Title", "Value")))

And finally, we can pass Lookup=ID in the URL to select the related item in the other list

How to deal with new fields?

If you add a new field to your list’s settings, you’ll have to edit the form in PowerApps, and then edit the fields and add the new one:

(I used this article as a starting point)

But if you prefer to use the ASK CLI, there is some steps to follow…

I first create a fake skill with ask new (using the “hello world” and “AWS Lambda” options).

Once the folder structure and files are created, I edit the .ask/ask-states.json file to reflect the information from the skill I created during the guide.

Then in the folder skill-package I remove everything except skill.json. To find what to put into that file, use the command: ask smapi get-skill-manifest -s <SKILL ID> and copy/paste that code.

Finally, I force the deploy with ask deploy --ignore-hash.

The Lambda function can now be managed locally on your computer and deployed with ASK CLI. You can go to the different skill consoles to delete the fake skill “hello world” you created.

const isMobile = Math.min(window.screen.width, window.screen.height) < 768 || navigator.userAgent.indexOf("Mobile") > -1;

You can list all domains associated with a certificate:

certbot certificates

Now we add the SSL using certbot. You need to list all the existing domains and add the new one:

certbot --apache --cert-name your-domain.com -d first.your-domain.com,second.your-domain.com,third.your-domain.com,the-new-one.your-domain.com

To only extract the email from this string, you’ll have to use the below:

first(split(last(split([YOUR_FIELD],'<')),'>'))

1. Install AutoControl: Keyboard shortcut, Mouse gesture
2. Install the native component as the extension asks for
3. Add a new action
4. The trigger is LEFT CTRL and TAB
5. The action is Switch to previous tab

It should now work to switch between tabs using LEFT CTRL + TAB.

1. Install Cmder in your desired location.
2. Download nvm-noinstall.zip from the latest release.
3. Extract the contents of nvm-noinstall.zip (i.e.: nvm.exe …) into the bin folder inside of the portable Cmder folder.
4. Navigate to the bin.
5. Create a new file called install_fix.cmd that contains this code.
6. Open a terminal in the bin folder and type .\install_fix.cmd
7. When asked to enter the path use the full path to your Cmder bin folder.
8. If it worked, a file called settings.txt has been created in the your Cmder bin folder.
9. Close the terminal, and reopen it in the bin folder.
10. Install the version of Node you want, e.g. nvm install latest.
11. Wait until the installation is completed, then, inside the bin folder, there should be a new folder containing the latest Node version (e.g. v17.3.0).

From there, you can use the full path to your Cmder bin + the Node version folder + node.exe to execute something with this version of Node using Powershell, CMD or other terminal.

For example:

PS D:\experiments\my-stuff\> D:\experiments\nodejs-portable\cmder_mini\bin\v17.3.0\node.exe index.js

You could use Cmder with the Node path in the Startup Settings of the app; e.g. set "PATH=D:\experiments\nodejs-portable\cmder_mini\bin\v17.3.0;%PATH%". This way, in Cmder, when typing node.exe it’s the portable version that will be used.

RewriteCond %{HTTPS} off
# First rewrite to HTTPS:
# Don't put www. here. If it is already there it will be included, if not
# the subsequent rule will catch it.
RewriteRule .* https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]
# Now, rewrite any request to the wrong domain to use www.
RewriteCond %{HTTP_HOST} !^www\.
RewriteRule .* https://www.%{HTTP_HOST}%{REQUEST_URI} [L,R=301]

1) Install smalidea plugin

Download the smalidea plugin (see also the related Github Repository).

Open up Android Studio and you should see the welcome screen like the one on screenshot below (if not, close your current project by selecting File -> Close project), go to the Plugins section, and from the wheel icon, select Install Plugin from Disk.... Select the smalidea plugin (ZIP file) you downloaded.

2) Get the third party APK

You first need to know the type of platform where you’ll do your debug tests. To do so, make sure your device is connected to your computer (it could also be a virtual device started from the AVD Manager) with adb devices.
Then, use the command adb shell getprop ro.product.cpu.abi to find the type of processor you have. When I use my phone, I got arm64-v8a.

Go to an APK platform, like https://apkcombo.com/ and search for the Android app you want to debug. Download the APK version that fits to the type you found before:

2bis) Have a look at the APK content

You can use JADX to open the APK and have a quick look at the code.

3) Decompile APK

With APKTool, we’ll use the command: .\apktool.bat d ".\the_original_app_from_apkcombo.com.apk" -o app_to_debug.
A folder called app_to_debug is created with the decompiled version of the application.

Next, we need to copy the source files: create a folder called “src” in the new app_to_debug folder, and type cp -R smali*/* src/.

4) Import project in Android Studio

Open an existing Android Studio project and select the app_to_debug folder where you unpacked APK.

Once the project loads, you need to tell the IDE where is your source code. Make sure you’re using the “Project view” in the left side panel:

Now you can see folder structure in your left panel. Find src/ subfolder right click it and select Mark Directory as -> Sources Root.

5) Prepare App for Debugging

Open AndroidManifest.xml from the app_to_debug and find the XML element <application>. Add the attribute android:debuggable with value “true”. Example:

<application android:debuggable="true" android:allowBackup="true" android:icon="@mipmap/ic_launcher" android:label="@string/app_name" android:largeHeap="true" android:name="org.horaapps.leafpic.App" android:theme="@style/Theme.AppCompat">

6) Repack to APK

You can now repack to APK with the command .\apktool.bat b -d ".\app_to_debug\" -o app_unsigned.apk

7) Sign the APK

7a) Create a keystore

You first need a keystore using keytool and type the below command:
keytool -genkeypair -v -keystore mykey.keystore -alias mykey -keyalg RSA -keysize 2048 -validity 10000

Several questions you’ll be asked, as well as a password. Make sure to remember the password for later.

7b) Validate the APK

You then need zipalign that can be found in the Android SDK folder (e.g. C:\Users\USERNAME\AppData\Local\Android\Sdk\build-tools\31.0.0\zipalign.exe) to validate your APK:
.\Path\to\Android\Sdk\build-tools\31.0.0\zipalign.exe -f -v 4 .\app_unsigned.apk .\app_ready.apk

7c) Sign the APK

Finally you can sign the new created APK with apksigner:
.\Path\to\Android\Sdk\build-tools\31.0.0\apksigner.bat sign --ks .\mykey.keystore --ks-key-alias app_to_debug --out .\app_signed.apk .\app_ready.apk

8) Install the APK

You can install it using adb install app_signed.apk

9) Prepare the host

On your Android device, go to Settings -> Developer options and set USB debugging and Wait for debugger options on. The latter is optional but useful as it allows you wait for debugger connection and not to run app yet.

Finally, you should tap on Select debug app and choose the app you just installed. After all of these, your Developer options menu should look somewhat like this:

Now, launch the app on the Android device, and you’ll get the below message:

10) Forward debugger port

You can use the adb’s port forwarding feature and forward JDWP service where application’s debug interface is listening.

Find the JDWP port with the command adb jdwp, then use this port with the command:
adb forward tcp:5005 jdwp:JDWP_PORT

11) Connect Debugger

Go to Android Studio and from its top menu bar choose Run -> Debug…, then a small message appears with one unique option that is Edit Configurations.... There, in the window, use a plus (+) button at the opt left, and add a new configuration of type Remote. Leave the default configuration as is. Click the Debug button and your app should be running with the attached debugger which means it will stop once a breakpoint is hit and you can investigate the content of app’s variables.

See this wiki page for details: https://github.com/Aymkdn/assistant-freebox-cloud/wiki/Capacitor-Plugin-for-HTTP-requests-with-self-signed-SSL-certificates

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
  <system.webServer>
    <httpProtocol>
      <customHeaders>
        <add name="Access-Control-Allow-Origin" value="https://my.site.com" />
        <add name="Access-Control-Allow-Headers" value="Authorization,Accept,Content-Type,X-Requested-With" />
        <add name="Access-Control-Allow-Credentials" value="true" />
      </customHeaders>
    </httpProtocol>
  </system.webServer>
</configuration>

A colleague has an older version (april 2020) that works correctly. Here is the link to download this version: SharepointMigrationToolSetup_April2020

Add your website to the Trusted Website zone:

Next open Windows Explorer and right-click on “Your PC “, then select “Map network drive…”:

You need to use a special path to your website. Let’s say your website is located at https://tenant.sharepoint.com/sites/Marketing then the path to use is:
\\tenant.sharepoint.com@ssl\DavWWWRoot\sites\Marketing\

Note the @ssl and DavWWWRoot that are required.

Assign this path to a drive letter:

I’m on Windows 10 and after trying many different things, I found a workaround:

1. Open a CMD window (by pressing Windows key + X, then select Windows PowerShell (Admin))
2. Then type: netsh wlan set autoconfig enabled=no interface="Wi-Fi"
3. You won’t see any WiFi network anymore from the Wifi icon, but it stops the issues with the connectivity

If you need to connect to a different network, or if you have restarted your computer, you may need to turn it on again with the below command:
netsh wlan set autoconfig enabled=yes interface="Wi-Fi"

Once connected, make sure to turn if off again.

Now I want to remove just one domain from this certificate, and it becomes complicated to understand how to do it. The best solution is to create a new certificate for each of my domains, and then to delete the original certname.

Let’s say my certname is called www.example.com and it contains the below domains:

• www.example.com
• example.com
• blog.example.com
• other-example.com
• www.other-example.com
• my-other-domain.com
• www.my-other-domain.com
• api.test.com

The one I don’t need anymore is *.my-other-domain.com.

First, we create a certificate individually for each domain that we want to keep:

certbot --apache --cert-name example.com -d example.com,www.example.com,blog.example.com
certbot --apache --cert-name other-example.com -d other-example.com,www.other-example.com
certbot --apache --cert-name test.com -d api.test.com

--cert-name permits to give our own name to the certificate, and -d indicates which domains should be added to this certificate.

Then we can list all our certificates:

certbot certificates

Using the above command you can find the Certificate Path and now we can delete our original certificate:

certbot revoke --cert-path /etc/letsencrypt/live/www.example.com/fullchain.pem

You’re all set! All your domains should still have a correct certificate, and you revoked the ones you don’t need anymore.