Make sure script waits for await fetch result before continuing

I need to make a post request so I’m using the fetch request below.

async function record(recording_url, options) {
    const recording_outcome = await fetch (recording_url, options);
    const outcome = await recording_outcome.json();

    return outcome;
}


let outcome = record(recording_url, options);
let record_div = document.getElementById("record_creation");
let record_saved = document.createElement("p");
record_saved.innerText = result.outcome;

However I’ve found the it doesn’t wait and the rest of the script keeps running and when adding to the innertext it prints a promise object. Do I need to restructure this or is there a sensible way to make sure it waits for the result?

I did try adding a promise like in the example below but that didn’t work as expected.

outcome.then(function(result){
   record_saved.innerText = result.outcome;
});

I want some help creating a live chat [closed]

I am building a live chat for an IT class project using html,css,php and JS. My problem is that i don’
t know how to make this chat live-time. I have built the chat window, uploaded all the chat users but when i click to send a message on the chat window it redirects me to the ‘send_message.php’ page. The message upload successfull on my database, but i can’t display it on the chat window. I will provide bellow the chat-page scripts, and php files,both for upload and send_messages. Any help would be appreciated!

(Html-page)

<!DOCTYPE html>
<html>


<?php

session_start();
include('configuration.php');
$conn=new mysqli($servername,$username,$password,$dbname);
if($conn->connect_error){
    error_log("Error:".$conn->connect_error,3,"localhost/www/chatapp/errorlogs.txt");
    die("Connection failed:".$conn->error);
}
if(!isset($_SESSION['username'])){
    header("Location:loginform.php?");
    exit();
}
$username=htmlspecialchars($_SESSION['username']);
$stmt=$conn->prepare("Select username from registers where username=?");
$stmt->bind_param("s",$username);
$stmt->execute();
$stmt->bind_result($db_username);
$stmt->fetch();

$profile_data_retrieved=false;

if($db_username){
    $profile_data=['username'=>$db_username];
    $profile_data_retrieved=true;
}else{
    error_log("Error:".$conn->connect_error,3,"localhost/www/chatapp/errorlogs.txt");
    echo"Error";
}
$stmt->close();
$conn->close();


    






?>
<head>
<title>SecretChat</title>

<link rel="stylesheet" href="wlcmpg.css"/>





</head>

<body>
<h1>SecretChat</h1>

<?php
echo'<div class="usr">'.'Welcome'." " . htmlspecialchars($profile_data['username']).'</div>';
?>


<h3>Welcome to secretchat.</h3>
<p>This web app is a test for a project on my it school to learn how to create
chat systems using signal or pgp cryptography to create safe communication platforms.</p>
<div class="chat">
<div class="chat-window" id="chat-window">
<form action="send_message.php" method="post" id="chat-form">
<div class="chat_header" id="chatuser">Chat</div>
<div class="chat_msg"></div>
<div class="chat_footer"></div>
<input type="hidden" name="receiver" id="receiver" value="receiver_username">
<textarea placeholder="type your message" name="message"></textarea>
<button onclick="sendMessage()">Send</button>
</div>
<div class="users-list">
<ul id="users-list"></ul>
</form>
</div>


</div>
<?php

include('configuration.php');

$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
    error_log("Error: " . $conn->connect_error, 3, "localhost/www/chatapp/errorlogs.txt");
    die("Connection failed: " . $conn->connect_error);
}

if (!isset($_SESSION["username"])) {
    header("Location: loginform.php?");
    exit();
}

$current_user = htmlspecialchars($_SESSION["username"]);
$current_chat_user = htmlspecialchars(isset($_GET['chat_user'])) ? $_GET['chat_user'] : '';

$stmt = $conn->prepare("SELECT username FROM registers WHERE username != ? AND username != ?");
if ($stmt === false) {
    error_log("Error preparing statement: " . $conn->connect_error, 3, "localhost/www/chatapp/errorlogs.txt");
    die("Error preparing statement: " . $conn->connect_error);
}

$stmt->bind_param("ss", $current_user, $current_chat_user);
$stmt->execute();
$stmt->bind_result($user);

while ($stmt->fetch()) {
    echo '<li onclick="openChatWindow('' . htmlspecialchars($user, ENT_QUOTES, 'UTF-8') . '')">' . htmlspecialchars($user, ENT_QUOTES, 'UTF-8') . '</li>';
}

$stmt->close();
$conn->close();
?>
<script>
function openChatWindow(username) {
    console.log('Open chat with:', username);
    document.getElementById('chatuser').textContent = username;
    document.getElementById('chat-window').style.display = 'block';
    loadMessages(username); 
}
    




</script>


    
 


    
    
</body>
</html>

(send_message php script)

<?php
session_start();
include('configuration.php');
$conn=new mysqli($servername,$username,$password,$dbname);
if($conn->connect_error){
    error_log("Error:".$conn->connect_error,3,"localhost/www/chatapp/errorlogs.txt");
    die("Connection failed:".$conn->error);
}

 if (!isset($_POST['receiver']) || !isset($_POST['message'])) {
        die("Required parameters are missing.");
    }

$sender=$_SESSION['username'];
$receiver=$_POST['receiver'];
$message=$_POST['message'];

$stmt=$conn->prepare("Insert into messages(sender,receiver,message)values (?,?,?)");
$stmt->bind_param("sss",$sender,$receiver,$message);

if($stmt->execute()){
    echo"Message sent";
}else{
    error_log("Error sending the message".$conn->connect_error,3,"localhost/www/chatapp/errorlogs.txt");
    echo"Couldn't send the message";
}

$stmt->close();
$conn->close();

?>

(loadmsg_php file)

<?php
session_start();

include('configuration.php');

if (!isset($_SESSION['username'])) {
    http_response_code(403);
    exit('Unauthorized');
}

$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
    error_log("Error: " . $conn->connect_error, 3, "localhost/chatapp/errorlogs.txt");
    die("Connection failed: " . $conn->connect_error);
}

$receiver = isset($_GET['receiver']) ? trim($_GET['receiver']) : '';
$sender = $_SESSION['username'];

if (empty($receiver)) {
    http_response_code(400);
    exit('Invalid request');
}

$stmt = $conn->prepare("SELECT sender, receiver, message, timestamp FROM messages WHERE (sender = ? AND receiver = ?) OR (sender = ? AND receiver = ?) ORDER BY timestamp ASC");
$stmt->bind_param("ssss", $sender, $receiver, $receiver, $sender);
$stmt->execute();
$result = $stmt->get_result();

$messages = [];
while ($row = $result->fetch_assoc()) {
    $messages[] = $row;
}
$stmt->close();
$conn->close();





?>

TypeORM Entity metadata for Some#other was not found. Check if you specified a correct entity object and if it’s connected in the connection options

Im having an issue and i have read almost all other active issues on this topic. Im trying to make a custom ManyToMany mapping table as per the TypeORM docs using a seperate entity:

Mapping entity:

import { Entity, Column, ManyToOne, JoinColumn } from 'typeorm';
import { Driver } from './driver.entity';
import { RegistrationStatus } from '../utils/enums';
import { EntityHelper } from './base/entity-helper';
import { Car } from './car.entity';

@Entity()
export class DriverCarsAndStatus extends EntityHelper {
  @ManyToOne(() => Driver)
  @JoinColumn()
  driver: Driver;

  @ManyToOne(() => Car)
  @JoinColumn()
  car: Car;

  @Column({
    type: 'enum',
    enum: RegistrationStatus,
    default: RegistrationStatus.PENDING,
  })
  status: RegistrationStatus;
}

Driver entity:

import { Exclude, Expose } from 'class-transformer';
import {
  AfterLoad,
  BeforeInsert,
  BeforeUpdate,
  Column,
  Entity,
  Index,
  JoinColumn,
  ManyToOne,
  OneToMany,
  OneToOne,
} from 'typeorm';
import * as bcrypt from 'bcryptjs';
import { IsNumber, IsOptional, Max, Min } from 'class-validator';
import { DriverReview } from './driver-reviews.entity';
import { UserReview } from './user-reviews.entity';
import { RequestedDriver } from './requestedDriver.entity';
import {
  AuthProvidersEnum,
  OperationalStatus,
  RegistrationStatus,
} from '../utils/enums';
import { MainEntity } from './base/main-entity';
import { Car } from '@app/shared/entities/car.entity';
import { Trip } from './trip.entity';
import { Emergency } from './emergency.entity';
import { Role } from './role.entity';
import { Document } from '@app/shared/entities/document.entity';
import { DocumentType } from '../utils/enums';
import { Address } from './address.entity';
import { DriverCarsAndStatus } from './driverCarsStatuses.entity';

@Entity()
export class Driver extends MainEntity {
  @Column({ type: String, unique: true, nullable: true })
  // @Expose({ groups: ['me', 'admin'] })
  email: string;

  @Column({ nullable: true })
  @Exclude({ toPlainOnly: true })
  password: string;

  @Exclude({ toPlainOnly: true })
  public previousPassword: string;

  @Index()
  @Column({ type: String, nullable: true })
  firstName?: string;

  @Index()
  @Column({ type: String, nullable: true })
  lastName?: string;

  @Column({ type: String, nullable: true })
  phoneCode: string;

  @Column({ type: String, nullable: true })
  phoneNumber: string;

  @Column({ type: String, nullable: true })
  countryCode: string;

  @IsNumber({ maxDecimalPlaces: 1 })
  @Max(5)
  @Min(1)
  @Column({ type: 'float', default: 5 })
  rating: number;

  @Column({ type: 'date', nullable: true })
  birthDate: Date;

  @Column({ nullable: true })
  nationalId?: string;

  @Column({
    type: 'enum',
    enum: RegistrationStatus,
    default: RegistrationStatus.PENDING,
  })
  registrationStatus: RegistrationStatus;

  @Column({
    type: 'enum',
    enum: OperationalStatus,
    default: OperationalStatus.ACTIVATED,
  })
  operationalStatus: OperationalStatus;

  @Column({ type: 'decimal', nullable: true })
  totalCashFlow: number;

  @Column({ type: 'decimal', nullable: true })
  totalTaxes: number;

  @Column({ type: 'decimal', nullable: true })
  totalEarnings: number;

  @Column({ type: 'decimal', nullable: true })
  moneyInWallet: number;

  @Column({ nullable: true })
  employeeNumber: number;

  @Column({ nullable: true })
  statusReason: string;

  @OneToMany(() => Trip, (trip) => trip.driver)
  @JoinColumn({ name: 'driverId' })
  trips: Trip[];

  @ManyToOne(() => Role, {
    eager: true,
  })
  role?: Role;

  // @OneToMany(
  //   () => DriverCarsAndStatus,
  //   (driverCarStatus) => driverCarStatus.driver,
  // )
  // driverCarStatuses: DriverCarsAndStatus[];

  @Column({ default: AuthProvidersEnum.email })
  @Expose({ groups: ['me', 'admin'] })
  provider: string;

  @Index()
  @Column({ type: String, nullable: true })
  @Expose({ groups: ['me', 'admin'] })
  socialId: string | null;

  @OneToMany(() => Document, (document) => document.driver, {
    nullable: true,
  })
  @IsOptional()
  @JoinColumn()
  documents: Document[] | null;

  @Column({
    type: 'jsonb',
    nullable: true,
    default: () => "'{}'",
  })
  declinedDocuments: Record<DocumentType, boolean>;

  @ManyToOne(() => Address, { nullable: true })
  address: Address;

  @OneToOne(() => Car, (car) => car.currentDriver)
  @JoinColumn()
  currentCar: Car | null;

  @OneToMany(() => DriverReview, (driverReview) => driverReview.author)
  authoredReviews: DriverReview[];

  @OneToMany(() => UserReview, (userReview) => userReview.targetDriver)
  receivedReviews: UserReview[];

  @OneToMany(() => Emergency, (emergency) => emergency.driver)
  emergencies: Promise<Emergency[]>;

  @OneToMany(() => RequestedDriver, (requestedDriver) => requestedDriver.driver)
  requestedDrivers: RequestedDriver[];

  @AfterLoad()
  public loadPreviousPassword(): void {
    this.previousPassword = this.password;
  }
  @BeforeInsert()
  @BeforeUpdate()
  async setPassword() {
    if (this.previousPassword !== this.password && this.password) {
      const salt = await bcrypt.genSalt();
      this.password = await bcrypt.hash(this.password, salt);
    }
  }
}

Car entity:

import {
  Entity,
  Column,
  JoinColumn,
  ManyToOne,
  OneToOne,
  OneToMany,
} from 'typeorm';
import {
  CarClass,
  OperationalStatus,
  RegistrationStatus,
} from '../utils/enums';
import { Make } from './make.entity';
import { Model } from './model.entity';
import { MainEntity } from './base/main-entity';
import { Driver } from '@app/shared/entities/driver.entity';
import { Trip } from './trip.entity';
import { Document } from './document.entity';
import { DriverCarsAndStatus } from './driverCarsStatuses.entity';
@Entity()
export class Car extends MainEntity {
  @Column()
  plateNumber: string;

  @Column()
  color: string;

  @ManyToOne(() => Make, (make) => make.car)
  @JoinColumn()
  make: Make;

  @ManyToOne(() => Model, (model) => model.car)
  @JoinColumn()
  model: Model;

  @Column({ type: 'int' })
  yearOfProduction: number;

  @Column({
    type: 'enum',
    enum: CarClass,
  })
  carClass: CarClass;

  @Column({ nullable: true })
  taxiNumber: number;

  @Column({
    type: 'enum',
    enum: OperationalStatus,
    nullable: true,
  })
  operationalStatus: OperationalStatus;

  @Column({ type: 'enum', enum: RegistrationStatus })
  registrationStatus: RegistrationStatus;

  // @OneToMany(
  //   () => DriverCarsAndStatus,
  //   (driverCarStatus) => driverCarStatus.car,
  // )
  // driverCarStatuses: DriverCarsAndStatus[];

  @OneToMany(() => Document, (document) => document.car)
  carDocuments: Document[];

  @OneToOne(() => Driver, (driver) => driver.currentCar)
  currentDriver: Driver | null;

  @OneToMany(() => Trip, (trip) => trip.car, { nullable: true })
  @JoinColumn({ name: 'carId' })
  trips: Trip[];
}

I have the file name specified correctly:
driverCarAndStatuses.entity.ts as per the typeORM config file:

entities: [__dirname + '/../**/*.entity{.ts,.js}'],
      migrations: [__dirname + '/migrations/**/*{.ts,.js}'],
      cli: {
        entitiesDir: 'src',
        migrationsDir: 'src/database/migrations',
        subscribersDir: 'subscriber',
      },

And whenever if codeout the OneToMany decorators from either Driver or Car entity to make it bi-directional as needed I get the error:
[Nest] 26396 – 08/01/2024, 4:14:55 PM ERROR [TypeOrmModule] Unable to connect to the database. Retrying (1)…
[3] TypeORMError: Entity metadata for Driver#driverCarStatuses was not found. Check if you specified a correct entity object and if it’s connected in the connection options.

Everything i have tried for this issue:
Drop schema and dist folder after changes, double check file names and imports (everything is the same as others), autoLoadEntities in orm config, checked
“emitDecoratorMetadata”: true,
“experimentalDecorators”: true,
for tsconfig,
added Entity DriverCarAndStatus in TypeORM.forFeatur in both Driver and Car modules.

Code not firing on page load until I adjust zoom level on browser | Webflow [closed]

I have a webflow site where I am using a JS script to create a masonry layout for my projects. The code is working fine on all instances on my site apart from one where it does not trigger unless I adjust the zoom level on the browser which causes it to fire.

The script I am using is this: https://www.webflow-tools.refokus.com/tools/masonry-layout

The page with the issue is here: https://www.ciaransmith.work/projects/rite-aid. (the section with the issue is under the heading ‘Paid and organic social content’)

The items should be appearing in a masonry style list but on page load start off stacked in one column. Upon adjusting the zoom level in the browser the code appears to activate. There is a second instance of the same code working fine further down on the same page.

Anyone have thoughts about what the issue may be here?

Why is my ridgeline plot not closing correctly?

I wanted to make a Ridgeline Plot, which changes, when using a dropdown menu to change the data.
Started with a simple attempt first, and first rows are fine, but one of them is kinda off.
The line is not closing on the same y-coord. like at the beginning of the line-path.path not closing in one of the rows of my plot

The code snippet:

const kde = kernelDensityEstimator(kernelEpanechnikov(7), xR.ticks(150)) 

  const allDensity = []
  for (i = 0; i < monthN; i++) {
      key = monthsAvg[i]
      density = kde( yearData.map(function(d){  return d[key]; }) )
      allDensity.push({key: key, density: density})
  }

  svgR.selectAll("areas")
    .data(allDensity)
    .join("path")
      .attr("transform", function(d){return(`translate(0, ${(yNameR(d.key)-heightR)})`)})
      .datum(function(d){return(d.density)})
      .attr("fill", "#69b3a2")
      .attr("stroke", "#000")
      .attr("stroke-width", 0.5)
      .attr("d",  d3.line()
          .curve(d3.curveBasis)
          .x(function(d) { return xR(d[0]); })
          .y(function(d) { return yR(d[1]); })
      );


  function kernelDensityEstimator(kernel, X) {
    return function(V) {
      return X.map(function(x) {
        return [x, d3.mean(V, function(v) { return kernel(x - v); })];
      });
    };
  }
  function kernelEpanechnikov(k) {
    return function(v) {
      return Math.abs(v /= k) <= 1 ? 0.75 * (1 - v * v) / k : 0;
    };}

When I change the y-coord. manually in the browser it will come out correctly. But since I have a function drawing the plots based on my data, I have no idea how to approach this issue.

If anyone has an idea how to make every plot end on the same y-coordinate, I would be really glad.

Nested promise.all calls in js resolve before async processes finish

I’m currently working on a service worker in typescript that needs to iterate through all the client caches, then iterate through each cache’s keys to determine if entries should be kept or deleted. After each entry in a cache has been evaluated, it should move on to the next cache until all finish. I can do it with a single cache, but when I try to map out all the caches it simply iterates through the cache keys and resolves the initial promise without completing each iteration. Clearly I have an issue with my promise chaining, but I’m not sure where. Here is a simplified version of the code.

cacheProcessing = new Promise<any>((resolveCacheProcessing, rejectCacheProcessing) => {                                                  
   self.caches.keys().then((cacheList)=>{
      const cacheCycle = Promise.all( //cache cycle promise
         cacheList.map((cacheName) => {
            console.log("Scanning cache: " + cacheName)                         
            self.caches.open(cacheName).then((result)=>{                                                                                                                                
               result.keys().then((keyList)=>{
                  return Promise.all( //key cycle promise
                     keyList.map((key)=>{
                        if(a){
                           return result.delete(key);
                        }
                        return somethingelse;
                     })
                  )                                                         
               })
            })  
         })
      );
      cacheCycle.then(resolveCacheProcessing); //for some reason it resolves before finishing
   })
});

cacheProcessing.then((cacheProcessingResult)=>{
   console.log("Done processing cache...")
})

My guess is this has something to do with the async operations of getting the cache keys and opening each individual cache. Any advice is greatly appreciated!

Error when using Square brackets when creating arrays in JavaScript [closed]

When I try to create an Array in Javascript I get a mistake on a console log that says: Uncaught SyntaxError: Unexpected token ‘[‘ . Any idea what to do about it?I have included an image of the error

I tried to use different square brackets in case ASCII code on my keyboard was wrong
I also tried different JavaScript editor, but I get the same mistake

None of my solutions worked

JS Promise resolve not working on first iteration

I’m trying to play Animation of SVG path, and a voiceover generated by Microsoft tts. I have made a function.

  async function playWithSound(pathArrangement, i, len) {

         const synth = window.speechSynthesis;
         pathid = pathArrangement[i];
         script = scriptData[pathData[pathid].name];

         console.log(script)

         const utterance = new SpeechSynthesisUtterance(script);
         utterance.voice = neerjaVoice || synth.getVoices()[0];

         await synth.speak(utterance);
         utterance.onstart = () => {
            document.getElementById(pathid).style.animationPlayState = 'running';
            followPencil(pathid);
         }



         // Create a promise that resolves when the speech synthesis ends
         const speechEndPromise = new Promise((resolve) => {
            utterance.onend = resolve;
         });

         const animationEndPromise = new Promise((resolve) => {
            document.getElementById(pathid).addEventListener('animationend', () => {
               resolve();
            }, { once: true });
         });
         // wait for promises to resolve and call the next stack
         await Promise.all([animationEndPromise, speechEndPromise]);
         console.log("resolved both")

         i++;
         if (i < len) {
            playWithSound(pathArrangement, i, len);
         }
         return;
      }

The problem with the above function is that when the speech ends first before the animation ends for the first iteration then from nowhere the promise is resolved and it’s jumps to next iteration. But when the speech ends after the animation ends it works fine.

I have recorded a video you can see it here: video

Recharts Charts Stacking Issue

I’m using Recharts, the React charting library. My app contains a header that is fixed and at the top, and all the other content just flow under it when I scroll down.

However, the charts I created with recharts are flowing on top of the header.

I’ve tried increasing the z-index of the header and reducing the z-index of the charts, but none of these approaches are working. I’ve also tried using isolate, it’s not working either.

Issue with Dropdown Pre-selection in ASP.NET Core MVC with Chosen.js Plugin

Problem

I’m working on an ASP.NET Core MVC application where I need to pre-select values in dropdown lists based on data from the model. I’m using the Chosen.js plugin to enhance the dropdowns. However, the dropdowns are not showing the pre-selected values when the page loads.

Code Overview

Here’s a snippet of my view code:

@for (int i = 0; i < Model.Cards_BR.Count; i++)
{
    <tr id="row-@i">
        <td data-label="Nazwa projektu">
            <select id="ProjectName-@i" name="Cards_BR[@i].ProjectId" class="form-control">
                <option value="">Wybierz projekt</option>
                @foreach (var project in Model.Projects)
                {
                    <option value="@project.Id">@project.Name</option>
                }
            </select>
        </td>
        <!-- Similar structure for other dropdowns -->
    </tr>
}


I’m using JavaScript to set the selected values:


function setSelectedValues(index, projectId, qualificationId, phaseId, categoryId) {
    const projectNameDropdown = document.getElementById(`ProjectName-${index}`);
    const qualificationDropdown = document.getElementById(`ActivityQualification-${index}`);
    const phaseDropdown = document.getElementById(`ProjectPhase-${index}`);
    const categoryDropdown = document.getElementById(`CategoryOfActivities-${index}`);

    if (projectNameDropdown) {
        projectNameDropdown.value = projectId;
    }

    if (qualificationDropdown) {
        qualificationDropdown.value = qualificationId;
    }

    if (phaseDropdown) {
        phaseDropdown.value = phaseId;
    }

    if (categoryDropdown) {
        categoryDropdown.value = categoryId;
    }

    // Initialize Chosen after setting the values
    $(`#ProjectName-${index}`).chosen();
    $(`#ActivityQualification-${index}`).chosen();
    $(`#ProjectPhase-${index}`).chosen();
    $(`#CategoryOfActivities-${index}`).chosen();
}

The setSelectedValues function is called on DOMContentLoaded:

document.addEventListener("DOMContentLoaded", function () {
    setSelectedValues(@i, "@Model.Cards_BR[i].ProjectId", "@Model.Cards_BR[i].QualificationId", "@Model.Cards_BR[i].PhaseId", "@Model.Cards_BR[i].CategoryId");
});


Logs Observed

I added logging to the setSelectedValues function to track the values being set, and the console output shows the following:

Initializing values for row: 0
Project ID: 8, Qualification ID: 7, Phase ID: 21, Category ID: 39
Project dropdown value set to: 8
Qualification dropdown value set to: 7
Phase dropdown value set to: 21
Category dropdown value set to: 39

What I’ve Tried

  1. Ensured the model data is correct and contains the expected values.

  2. Verified that the setSelectedValues function is being called and that the correct values are being passed to it.

  3. Initialized Chosen.js after setting the values to ensure the plugin is not overriding the selection.

  4. Checked the JavaScript console for errors and confirmed that the correct values are being set in the function.

Current Behavior

Despite the values being correctly set in the JavaScript function and confirmed in the logs, the dropdowns do not display the selected values in the UI. They always show the default option (“Wybierz projekt,” “Wybierz kwalifikacjÄ™,” etc.), rather than the pre-selected values from the model.

Model structure

public class ParentModel
{
    public List<Cards_BR> Cards_BR { get; set; } = new List<Cards_BR>();
    public List<Project> Projects { get; set; } = new List<Project>();
    public List<Qualification> Qualifications { get; set; } = new List<Qualification>();
    public List<Phase> Phases { get; set; } = new List<Phase>();
    public List<Category> Categories { get; set; } = new List<Category>();
}

public class Cards_BR
{
    public int ProjectId { get; set; }
    public Project Project { get; set; }

    public int QualificationId { get; set; }
    public Qualification Qualification { get; set; }

    public int PhaseId { get; set; }
    public Phase Phase { get; set; }

    public int CategoryId { get; set; }
    public Category Category { get; set; }
}

public class Project
{
    public int Id { get; set; }
    public string Name { get; set; }
}

public class Qualification
{
    public int Id { get; set; }
    public string Name { get; set; }
    public ICollection<Phase> Phases { get; set; } = new List<Phase>();
}

public class Phase
{
    public int Id { get; set; }
    public string Name { get; set; }
    public int QualificationId { get; set; }
    public Qualification Qualification { get; set; }
    public ICollection<Category> Categories { get; set; } = new List<Category>();
}

public class Category
{
    public int Id { get; set; }
    public string Name { get; set; }
    public int PhaseId { get; set; }
    public Phase Phase { get; set; }
}


Question

What could be causing the dropdowns to not show the pre-selected values despite the logs showing that the correct values are being set? How can I ensure that the selected values are displayed correctly in the UI?

If i refresh my project in inspect mode its stop to use locomotive js any destroy the whole project

Issue with Locomotive JS After Reloading in Inspect Mode

I have cloned the Works.Studio.com webpage and successfully added responsiveness to my project. Everything works fine, including the Locomotive JS functionality, when I am not in Inspect mode. However, after reloading the page while in Inspect mode, the Locomotive JS stops functioning.

You can view the project here: https://examplezz-id122.github.io/project_work_studio/

How can I resolve this issue to ensure that Locomotive JS continues to work correctly even after a reload in Inspect mode?

  1. I check the console error first but there should be no error.

  2. I check if the link is broken or not, but all links are proper.

  3. I asked ChatGPT and other ai tools about my problem, but they not satisfied me.

  4. before reloading Screenshot of without reloading

  5. after reloading Screenshot of after reloading

rrule with exdate and until

I’m using rrule.js library with the rrulstr as follow:

const rrule = rrulestr(
        `DTSTART:20190610T103000nRRULE:FREQ=DAILY;INTERVAL=1;UNTIL=20190801nEXDATE:20190618T103000ZnEXDATE:20190619T103000`
    )

it does exclude the dates according exdate but there is 2 problems :

  1. rrule.options.dtstart is not as in the recurrence string , it is according current time
  2. rrule.options.until is null

** when removing the exdate from the recurrence string the dtstart and until are as excpecting

what am I missing ? I know that exdate is not property of rrule but I’m doing as described in documents

Python Selenium: Scroll inside an element until element is found

I have a scrollable div element inside a webpage that I need to scroll down until a particular element is found. The problem is the script that I am using only scrolls to a particular area on that scrollable element.

// This is the xpath of the scrollable element
scrollableSectionXPATH = '//*[@id="root"]/div/div[2]/div[2]/div/div[2]/div' 
scrollableSection = context.driver.find_element(By.XPATH, scrollableSectionXPATH)

// This is the xpath of the element that I need to find inside the scrollable element
element = '//form[@class='field-config']/div[1]/div[1]/div[1]/div[1]'

// This is the java script that I found, it works, but it only scrolls into a fixed particular area on the scrollable div element
context.driver.execute_script("arguments[0].scrollIntoView();", scrollableSection)

Where shall I put the “element” variable on the script so the system scrolls down until the “element” is found?

How to receive file from Postman or Next.js with POST method

I want to send a file as image or pdf. While I am using Postman, I make POST method and body type is form-data. Liike this screenshot:

enter image description here. But I can’t receive any body in Express. My Node.js code is like:

enter image description here

And output is like that:

enter image description here

I tried multer and multipart libraries, but it doesn’t work.
How can I solve this problem?