Added a function for the classic editor that properly calculates the …

…permalink length. Define the "transformed" URL length, according to the Twitter docs: https://developer.twitter.com/en/docs/counting-characters. Added "twitterURLLength" to the adminAutoshareForTwitter localized object. Refactored classic editor and block editor codebases to prefer the "twitterURLLength" value, if available.

assets/js/admin-autoshare-for-twitter-classic-editor.js

@@ -125,15 +125,41 @@
 	}
 
 	/**
-	 * Updates the counter
+	 * Calculates the permalink length
 	 */
-	function updateRemainingField() {
+	function getPermalinkLength() {
 		let permalinkLength = 0;
 		if ( $('#sample-permalink').length ) {
-			permalinkLength = $('#sample-permalink').text().length
+			if (adminAutoshareForTwitter.twitterURLLength) {
+				// according to this page https://developer.twitter.com/en/docs/counting-characters, all URLs are transformed to a uniform length
+				permalinkLength = adminAutoshareForTwitter.twitterURLLength;
+			} else {
+				// The #sample-permalink > a tag seems like the only convenient place to get the correct path for the post,
+				// without doing an AJAX call. We're using this technique to isolate the path (remove the <span>):
+				// https://stackoverflow.com/a/74517817
+				let slug = $("#editable-post-name-full").text();
+
+				// get the hypothetical path
+				let aTagContents = $("#sample-permalink > a")[0].innerHTML;
+				let workingDiv = document.createElement("span");
+				workingDiv.innerHTML = aTagContents;
+				let fakeSlugSpan = workingDiv.querySelector('span');
+				workingDiv.removeChild(fakeSlugSpan);
+				let permalinkPrefix = workingDiv.innerText;
+				let permalink = permalinkPrefix + slug + '/';
+				permalinkLength = permalink.length;
+			}
 		}
 		// +5 because of the space between body and URL and the ellipsis.
 		permalinkLength += 5;
+		return permalinkLength;
+	}
+
+	/**
+	 * Updates the counter
+	 */
+	function updateRemainingField() {
+		const permalinkLength = getPermalinkLength();
 
 		var count = $tweetText.val().length + permalinkLength;
 		$tweetText.attr('maxlength', limit - permalinkLength);

autoshare-for-twitter.php

@@ -26,6 +26,7 @@
 define( 'AUTOSHARE_FOR_TWITTER_URL', plugin_dir_url( __FILE__ ) );
 define( 'AUTOSHARE_FOR_TWITTER_PATH', plugin_dir_path( __FILE__ ) );
 define( 'AUTOSHARE_FOR_TWITTER_INC', AUTOSHARE_FOR_TWITTER_PATH . 'includes/' );
+define( 'AUTOSHARE_FOR_TWITTER_URL_LENGTH', 23 );
 
 /**
  * Get the minimum version of PHP required by this plugin.

includes/admin/assets.php

@@ -211,6 +211,7 @@ function localize_data( $handle = SCRIPT_HANDLE ) {
 		'tweetAccounts'      => $tweet_accounts,
 		'tweetAccountsKey'   => TWEET_ACCOUNTS_KEY,
 		'connectedAccounts'  => $accounts ?? [],
+		'twitterURLLength'   => AUTOSHARE_FOR_TWITTER_URL_LENGTH,
 	];
 
 	wp_localize_script( $handle, 'adminAutoshareForTwitter', $localization );

includes/utils.php

@@ -214,7 +214,9 @@ function compose_tweet_body( \WP_Post $post ) {
 	$url = apply_filters( 'autoshare_for_twitter_post_url', get_the_permalink( $post->ID ), $post );
 
 	$url               = esc_url( $url );
-	$body_max_length   = 275 - strlen( $url ); // 275 instead of 280 because of the space between body and URL and the ellipsis.
+	// According to this page https://developer.twitter.com/en/docs/counting-characters, all URLs are transformed to a uniform length.
+	$url_length        = AUTOSHARE_FOR_TWITTER_URL_LENGTH ? AUTOSHARE_FOR_TWITTER_URL_LENGTH : strlen( $url );
+	$body_max_length   = 275 - $url_length; // 275 instead of 280 because of the space between body and URL and the ellipsis.
 	$tweet_body        = sanitize_text_field( $tweet_body );
 	$tweet_body        = html_entity_decode( $tweet_body, ENT_QUOTES, get_bloginfo( 'charset' ) );
 	$tweet_body_length = strlen( $tweet_body );

src/js/components/TweetTextField.js

@@ -3,10 +3,15 @@ import { useSelect } from '@wordpress/data';
 import { __, sprintf } from '@wordpress/i18n';
 import { useTweetText } from '../hooks';
 import { useEffect, useState } from '@wordpress/element';
-const { siteUrl } = adminAutoshareForTwitter;
+const { siteUrl, twitterURLLength } = adminAutoshareForTwitter;
 
 export function TweetTextField() {
 	const getPermalinkLength = ( select ) => {
+		if ( twitterURLLength ) {
+			// according to this page https://developer.twitter.com/en/docs/counting-characters, all URLs are transformed to a uniform length
+			return twitterURLLength;
+		}
+
 		const permalink = select( 'core/editor' ).getPermalink();
 
 		if ( permalink ) {