ما الذي يتحكم في ترتيب التنفيذ لملفات j/s الخاصة بمكونات Theme؟

I have j/s in my theme (am I infamous yet? ;) which is modifying the DOM by adding elements via api.decorateCooked(…. It inserts a variety HTML head elements.

I also have the DiscoTOC Theme component installed.

However, adding the usual <div data-theme-toc="true"> </div> that DiscoTOC notices and expands, doesn’t generate a table-of-contents including my dynamically inserted elements.

I’m figuring this might be as simple as execution order… if DiscoTOC looks before my j/s adds more elements . . .

What determines the ordering of execution if multiple bits of theme j/s code are calling api.cooked(?

3 إعجابات

bump? :slight_smile:

plus silliness to get to 20 characters

Note that DiscoTOC only runs on post contents - if you’re inserting those elements outside posts, it won’t see them.

I don’t think we’ve needed to define JS execution order yet.

إعجاب واحد (1)

I’m inserting within the post, yes. That’s why I suspect execution order.

Some bit of code determines the execution order… that’s the leverage point for me to get my component before TOC. eg, if it’s alpha by component name (ie, as displayed in the Component list in Admin area) then I can try namin my component accordingly, etc

Pretty sure that the component execution order is not based on the name of the component. It’s based on the ID by default.

That said, you can set initializer order for advanced use cases. I can put DiscoTOC in a named initializer so you can run your code before DiscoTOC, but I need to know what you’re trying to do first to give you a clear answer.

Your modifications here are based on an HTTP/AJAX request, correct?

إعجاب واحد (1)

Yes AJAX, but using a synchronous call. (I’ve always loved the oxymoron of synchronous AJAX :^)

I’m feeling like my next step is create a proper component—atm, it’s just some j/s pasted into my Theme’s Header. Then I can try fiddling with a judiciously chosen ID. “_foo” or “0-foo” might be all I need.

إعجاب واحد (1)

Don’t we all :wink:

Correct. If you want to use named initializers and initializer order, your component will need to have an initializer in the /javascript folder.

No worries, though. I can help with all of that. I’ll get back to you on this tomorrow with a full answer.

إعجاب واحد (1)

منذ فترة، قمت بتحويل اختراق j/s الخاص بي إلى مكون سمة مناسب.

أود العودة إلى الحصول على الترتيب بحيث يعمل المكون الخاص بي قبل جدول محتويات Discourse.

على حد علمي، يتم تقييم مكونات السمات (Theme Components) بعد الإضافات (plugins).

وقد أكون مخطئًا، ولكن يتم تحميلها بترتيب الأسماء، لذا فإن وضع x- أمام الاسم ساعدني في الماضي على ضمان تقييم مكون سمة معين في النهاية.

لا بأس. أحاول التحكم في ترتيب مكون DiscoTOC ( https://github.com/discourse/DiscoTOC.git ) ومكون من إنشائي الخاص.

تشير الردود من الآخرين أعلاه إلى أن اسم المكون لا يؤثر على ترتيب التنفيذ. لقد أعدت تسميتها للتو إلى aa-mycomponent و x-last-DiscoTOC ولم ينجح ذلك. [DiscoTOC لا يتضمن العناوين المضافة إلى DOM ديناميكيًا - نعم، داخل نص المنشور]

https://forum.moversmindset.com/t/list-of-movers-mindset-podcast-episodes/1160

@Johani هل لديك أي أفكار أخرى من مسار تفكيرك في شهر مايو؟

همممم… ربما الخطأ أكثر من مجرد ترتيب. لقد قمت للتو بفحص… والأشياء الموجودة في DOM والتي كنت أعتقد أنها عناوين HTML… هي في الواقع علامات DIV مع class="d-toc-ignore"

حان الوقت لأتعمق أكثر. أين ذهبت العناوين الخاصة بي؟ :slight_smile:

حسنًا، أعتقد أنه يمكنك إثبات ذلك بأي من الطريقتين من خلال تجربة مثال بسيط جدًا.

قم بإنشاء مكونين بسيطين، مع تجاوز أو ربط نفس الشيء، ربما قالب بسيط مع اختلاف طفيف، قم بتسمية أحدهما باسم يبدأ لاحقًا في الأبجدية، لاحظ أيهما ينتهي بتجاوز السمة.

من الواضح جدًا أنه مرتب حسب الاسم في الكود هنا في النموذج:

إعجاب واحد (1)

لا يؤثر الاسم على ترتيب التنفيذ. @merefield يؤثر السطر الذي ربطته على كيفية عرضها في واجهة المستخدم الإدارية، ولكنه لا يُستخدم للتنفيذ الفعلي.

هذا هو السطر ذي الصلة لترتيب التنفيذ:

لذلك يتم تنفيذها بترتيب تصاعدي لـ “id” في قاعدة البيانات.

الضمان الوحيد الذي يمكن نقله عبر مثيلات Discourse هو أن كود theme يتم تنفيذه دائمًا قبل كود theme component.

كما ذكر @Johani أعلاه، إذا كنت بحاجة إلى تشغيل الكود بعد تحميل مكون آخر، فإن أفضل رهان هو على الأرجح استخدام تهيئة Ember، والتي تدعم الترتيب. للأسف، لن يكون ذلك ممكنًا على الفور في هذه الحالة، نظرًا لأنه لا يبدو أن DiscoTOC يستخدم تهيئات Ember. سيؤدي تحديث DiscoTOC لاستخدام JavaScript متعدد الملفات (وبالتالي تهيئات Ember) بالتأكيد إلى الترحيب بـ pr-welcome.

3 إعجابات

هذا مؤسف لأنه قد يكون مفيدًا. شكرًا للتوضيح على أي حال!

إعجاب واحد (1)

(وهذا يتعلق بـ Theme component order of precedence)

فقط أعود لأقول إن ترتيب الأسبقية لمعرف قاعدة البيانات يعمل؛ يحل حاجتي. شكراً للجميع!

إعجابَين (2)